@yoka-ui/ui 1.0.10-test → 1.1.0

package/dist/lib/components/YkDateRangePicker/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/YkDateRangePicker/index.tsx"],
-  "sourcesContent": ["/**\n * YkDateRangePicker\n *\n * 带「紧凑预设 tag」与「完整 RangePicker」双模式切换的日期范围选择器。\n *\n * 功能特性：\n * - 默认紧凑模式：以 tag 形式展示「预设标签 + 格式化时间」或「起止时间」\n * - mount 时若无初始值，自动选中「近5分钟」预设\n * - 点击 tag 后展开内嵌的完整 RangePicker，失焦后自动收起\n * - 8 个内置快捷预设，2 列 Grid 布局渲染，当前激活项高亮\n * - 受控组件：区分「用户操作」与「外部赋值」，仅用户操作触发 onChange\n * - 禁用日期：仅允许过去 7 天（含今天）\n * - allowClear：支持一键清除，清除后重置预设状态\n * - 通过 forwardRef + useImperativeHandle 对外暴露 toggleFirstPreset()\n *\n * @example\n * ```tsx\n * const pickerRef = useRef<YkDateRangePickerRef>(null);\n *\n * <YkDateRangePicker\n *   value={range}\n *   onChange={(val) => setRange(val)}\n *   ref={pickerRef}\n * />\n *\n * // 外部强制切换到「近5分钟」\n * pickerRef.current?.toggleFirstPreset();\n * ```\n */\n\nimport { DatePicker } from 'antd';\nimport classNames from 'classnames';\nimport dayjs, { Dayjs } from 'dayjs';\nimport React, {\n  type ComponentRef,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport styles from './index.module.less';\nconst { RangePicker } = DatePicker;\n\n// ─── 类型 ─────────────────────────────────────────────────────────────────────\n\n/** 时间范围值 */\nexport type DateRangeValue = [Dayjs, Dayjs];\n\n/**\n * 预设项定义\n * - value()  每次调用都返回最新时间，避免闭包缓存旧值\n * - format() 可选，控制紧凑 tag 中的格式化展示文本\n */\ninterface RangePreset {\n  label: string;\n  /** 工厂函数，返回实时时间范围 */\n  value: () => DateRangeValue;\n  /** 自定义紧凑模式格式化：返回单个字符串或 [start, end] 数组 */\n  format?: (value: DateRangeValue) => string | [string, string];\n}\n\nexport interface YkDateRangePickerProps {\n  /** 受控值 */\n  value?: DateRangeValue | [];\n  /** 用户操作改变时触发（外部 setValue 不会触发） */\n  onChange?: (value: DateRangeValue | null) => void;\n  /**\n   * 是否允许清除。\n   * - false（默认）：隐藏清除按钮，与 Vue 原版行为一致\n   * - true：显示清除按钮，清除后重置预设状态并触发 onChange(null)\n   */\n  allowClear?: boolean;\n  /**\n   * 紧凑 tag 无值/清空时的占位文本。\n   * 默认：「请选择时间范围」\n   */\n  placeholder?: string;\n}\n\n/** 通过 ref 对父组件暴露的方法 */\nexport interface YkDateRangePickerRef {\n  /** 强制切换到第一个预设（近5分钟）并触发 onChange */\n  toggleFirstPreset: () => void;\n}\n\n// ─── 工具函数 ─────────────────────────────────────────────────────────────────\n\n/** 精确到分钟的过去时间区间 */\nfunction pastTime(n: number, unit: dayjs.ManipulateType): DateRangeValue {\n  const fmt = 'YYYY-MM-DD HH:mm:00';\n  return [dayjs(dayjs().subtract(n, unit).format(fmt)), dayjs(dayjs().format(fmt))];\n}\n\nconst DISPLAY_FORMAT = 'YYYY-MM-DD HH:mm:ss';\n\n/** 格式化 Dayjs 为紧凑模式展示字符串 */\nfunction toDisplay(d: Dayjs): string {\n  return dayjs(d).format(DISPLAY_FORMAT);\n}\n\n/** 格式化为预设匹配字符串（与 presetsFormat 保持一致） */\nfunction toMatchKey(d: Dayjs): string {\n  return dayjs(d).format(DISPLAY_FORMAT);\n}\n\n// ─── 内置预设列表 ─────────────────────────────────────────────────────────────\n\n/**\n * 8 个内置快捷预设。\n * value 始终是工厂函数，保证每次点击都获取最新的当前时间。\n */\nconst RANGE_PRESETS: RangePreset[] = [\n  {\n    label: '近5分钟',\n    value: () => pastTime(5, 'minute'),\n  },\n  {\n    label: '近15分钟',\n    value: () => pastTime(15, 'minute'),\n  },\n  {\n    label: '近30分钟',\n    value: () => pastTime(30, 'minute'),\n  },\n  {\n    label: '近1小时',\n    value: () => pastTime(1, 'hour'),\n  },\n  {\n    label: '近2小时',\n    value: () => pastTime(2, 'hour'),\n  },\n  {\n    label: '近6小时',\n    value: () => pastTime(6, 'hour'),\n  },\n  {\n    label: '今天',\n    value: () =>\n      [\n        dayjs(dayjs().startOf('day').format('YYYY-MM-DD HH:mm:00')),\n        dayjs(dayjs().endOf('day').format('YYYY-MM-DD HH:mm:00')),\n      ] as DateRangeValue,\n    // 紧凑模式只展示日期，如「03-25」\n    format: (v) => v[0].format('MM-DD'),\n  },\n  {\n    label: '昨天',\n    value: () =>\n      [\n        dayjs(dayjs().subtract(1, 'day').startOf('day').format('YYYY-MM-DD HH:mm:00')),\n        dayjs(dayjs().subtract(1, 'day').endOf('day').format('YYYY-MM-DD HH:mm:00')),\n      ] as DateRangeValue,\n    format: (v) => v[0].format('MM-DD'),\n  },\n  {\n    label: '近7天',\n    value: () =>\n      [\n        dayjs(dayjs().subtract(6, 'day').startOf('day').format('YYYY-MM-DD HH:mm:00')),\n        dayjs(dayjs().endOf('day').format('YYYY-MM-DD HH:mm:00')),\n      ] as DateRangeValue,\n    // 紧凑模式展示完整日期区间，如「2024-03-19 ~ 2024-03-25」\n    format: (v) => [v[0].format('YYYY-MM-DD'), v[1].format('YYYY-MM-DD')],\n  },\n];\n\n// ─── 主组件 ───────────────────────────────────────────────────────────────────\n\nconst YkDateRangePicker = forwardRef<YkDateRangePickerRef, YkDateRangePickerProps>(function YkDateRangePicker(\n  { value, onChange, allowClear = false, placeholder = '请选择时间范围' },\n  ref,\n) {\n  // ── 内部状态 ───────────────────────────────────────────────────────────────\n\n  /** 是否展示完整 RangePicker（false = 紧凑 tag 模式） */\n  const [showFullPicker, setShowFullPicker] = useState(false);\n\n  /** RangePicker 下拉面板是否展开 */\n  const [open, setOpen] = useState(false);\n\n  /**\n   * 当前激活的预设定义引用。\n   * undefined 表示用户手动选了自定义时间范围。\n   */\n  const [activePreset, setActivePreset] = useState<RangePreset | undefined>(undefined);\n\n  /**\n   * 紧凑 tag 中预设的格式化文本。\n   * 例：「12:00:00 ~ 13:00:00」或「03-25」或「2024-03-19 ~ 2024-03-25」\n   */\n  const [presetFormatText, setPresetFormatText] = useState<string | undefined>(undefined);\n\n  // ── Refs ───────────────────────────────────────────────────────────────────\n\n  /**\n   * 标记本次 value 变化是否由用户操作触发（非外部赋值）。\n   * 用 ref 而非 state，避免触发额外的重渲染。\n   * 与 Vue 版 selfChange 逻辑一致。\n   */\n  const selfChangeRef = useRef(false);\n\n  /**\n   * 标记当前 RangePicker.onChange 是否由预设点击触发。\n   * 用于区分「预设点击」vs「手动选择」，避免手动选择时错误保留预设状态。\n   */\n  const isPresetClickRef = useRef(false);\n\n  /** 组件根元素，用作 getPopupContainer */\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  /** RangePicker 实例 ref，用于编程式展开面板 */\n  const pickerRef = useRef<ComponentRef<typeof RangePicker>>(null);\n\n  /** 缓存上一次的 value，用于判断是否是外部变更 */\n  const prevValueRef = useRef(value);\n\n  // ── 默认值：mount 时无初始 value 则自动选中「近5分钟」 ───────────────────\n\n  useEffect(() => {\n    // 仅在外部未传有效初始值时执行一次\n    if (value && (value as DateRangeValue).length === 2) return;\n\n    const first = RANGE_PRESETS[0];\n    const currentValue = first.value();\n    const formatText = currentValue.map((v) => dayjs(v).format('HH:mm:ss')).join(' ~ ');\n\n    setActivePreset(first);\n    setPresetFormatText(formatText);\n\n    // 标记为用户操作，避免被下方的外部 value 监听 effect 清空预设状态\n    selfChangeRef.current = true;\n    onChange?.(currentValue);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  // ── 外部 value 变化同步 ────────────────────────────────────────────────────\n\n  useEffect(() => {\n    // 跳过初始 mount（value 未真正变化）\n    if (prevValueRef.current === value) return;\n    prevValueRef.current = value;\n\n    if (!selfChangeRef.current) {\n      // 外部 setField 赋值：清空预设状态（无法得知外部值对应哪个预设）\n      setActivePreset(undefined);\n      setPresetFormatText(undefined);\n    }\n    // 消费掉标记，等待下次用户操作重新置位\n    selfChangeRef.current = false;\n  }, [value]);\n\n  // ── 紧凑 tag 展示文本 ──────────────────────────────────────────────────────\n\n  /**\n   * 紧凑模式下起止时间的字符串表示。\n   * 与 Vue showState 计算属性逻辑一致。\n   */\n  const showState = useMemo<[string, string] | []>(() => {\n    if (!value || value.length < 2) return [];\n    return [toDisplay(value[0] as Dayjs), toDisplay(value[1] as Dayjs)];\n  }, [value]);\n\n  // ── 预设激活项检测 ─────────────────────────────────────────────────────────\n\n  /**\n   * 根据当前 value 匹配激活的预设 index（用于高亮渲染）。\n   * 将 value 和预设值都格式化为同一字符串后比对，与 Vue presetsNode computed 一致。\n   * 依赖 open，确保面板打开时（时间流逝后）重新计算。\n   */\n  const activePresetIndex = useMemo<number>(() => {\n    if (!value || value.length < 2) return -1;\n    const [v0, v1] = value as DateRangeValue;\n    const valKeys = [toMatchKey(v0), toMatchKey(v1)];\n    return RANGE_PRESETS.findIndex((preset) => {\n      const presetVal = preset.value();\n      const presetKeys = [toMatchKey(presetVal[0]), toMatchKey(presetVal[1])];\n      return valKeys[0] === presetKeys[0] && valKeys[1] === presetKeys[1];\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [value, open]);\n\n  // ── 事件处理 ──────────────────────────────────────────────────────────────\n\n  /**\n   * 点击预设项。\n   * 对应 Vue handleTogglePreset。\n   */\n  const handlePresetClick = useCallback(\n    (preset: RangePreset) => {\n      isPresetClickRef.current = true;\n\n      const currentValue = preset.value();\n\n      // 计算紧凑 tag 中的格式化文本\n      let formatText: string;\n      if (preset.format) {\n        const res = preset.format(currentValue);\n        formatText = Array.isArray(res) ? res.join(' ~ ') : res;\n      } else {\n        // 无自定义 format：默认展示时间部分，如「12:00:00 ~ 13:00:00」\n        formatText = currentValue.map((v) => dayjs(v).format('HH:mm:ss')).join(' ~ ');\n      }\n\n      setActivePreset(preset);\n      setPresetFormatText(formatText);\n\n      // 向父组件通知新值\n      selfChangeRef.current = true;\n      onChange?.(currentValue);\n\n      // 选完预设后收起 picker，用 setTimeout 等待 antd 动画完成\n      setTimeout(() => {\n        setOpen(false);\n        setShowFullPicker(false);\n      }, 0);\n    },\n    [onChange],\n  );\n\n  /**\n   * RangePicker onChange（用户手动选择日期或点击清除后触发）。\n   * 对应 Vue handleChange。\n   */\n  const handlePickerChange = useCallback(\n    (dates: [Dayjs | null, Dayjs | null] | null) => {\n      // 无论是否预设点击，只要触发 change 都先清空预设状态\n      setActivePreset(undefined);\n      setPresetFormatText(undefined);\n      isPresetClickRef.current = false;\n\n      selfChangeRef.current = true;\n\n      if (dates?.[0] && dates?.[1]) {\n        // 正常选择\n        onChange?.(dates as DateRangeValue);\n      } else {\n        // 点击清除：value 置为 []（空数组），并退回紧凑 tag 模式显示 placeholder\n        onChange?.(null);\n        setTimeout(() => {\n          setOpen(false);\n          setShowFullPicker(false);\n        }, 0);\n      }\n    },\n    [onChange],\n  );\n\n  /**\n   * 点击紧凑 tag → 展开完整 RangePicker 并聚焦。\n   * 对应 Vue handleClickPresetPicker。\n   */\n  const handleClickCompactTag = useCallback(() => {\n    setShowFullPicker(true);\n    // 等待 DOM 渲染后再触发 picker 展开\n    setTimeout(() => {\n      const el = pickerRef.current?.nativeElement;\n      if (el) {\n        // 触发第一个 input 的点击，使 antd RangePicker 展开面板\n        const input = el.querySelector<HTMLInputElement>('input');\n        input?.click();\n        input?.focus();\n      }\n    }, 0);\n  }, []);\n\n  /**\n   * RangePicker 面板开关回调。\n   * 面板关闭时延迟退回紧凑模式（避免与选择操作冲突）。\n   */\n  const handleOpenChange = useCallback((isOpen: boolean) => {\n    setOpen(isOpen);\n    if (!isOpen) {\n      setTimeout(() => {\n        setShowFullPicker(false);\n      }, 100);\n    }\n  }, []);\n\n  /**\n   * 禁用日期规则：只允许过去 7 天（含今天）。\n   * 对应 Vue disabledDate。\n   */\n  const disabledDate = useCallback((current: Dayjs) => {\n    return current && (current > dayjs().endOf('day') || current < dayjs().subtract(6, 'day').startOf('day'));\n  }, []);\n\n  /**\n   * Popup 挂载容器：挂在组件自身 wrapper 内，避免全局定位错乱。\n   * 对应 Vue getPopupContainer。\n   */\n  const getPopupContainer = useCallback((): HTMLElement => {\n    return wrapperRef.current ?? document.body;\n  }, []);\n\n  // ── antd presets 节点 ──────────────────────────────────────────────────────\n\n  /**\n   * 构建传入 RangePicker 的 presets prop。\n   * - label 为自定义 ReactNode，实现点击处理与高亮样式\n   * - value 传实时值供 antd 内部使用（如 disabledDate 校验）\n   * antd 5.x presets 格式：{ label: ReactNode; value: [Dayjs, Dayjs] }[]\n   */\n  const presetsNode = useMemo(() => {\n    return RANGE_PRESETS.map((preset, index) => {\n      const isActive = activePresetIndex === index;\n      return {\n        label: (\n          <div\n            className={classNames(styles.yokaPresetItem, {\n              [styles.yokaPresetItemActive]: isActive,\n            })}\n            onClick={(e) => {\n              // 阻止事件冒泡，避免与 antd 默认 preset 行为冲突\n              e.stopPropagation();\n              handlePresetClick(preset);\n            }}\n          >\n            {preset.label}\n          </div>\n        ),\n        value: preset.value() as [Dayjs, Dayjs],\n      };\n    });\n  }, [activePresetIndex, handlePresetClick]);\n\n  // ── 对外暴露方法 ───────────────────────────────────────────────────────────\n\n  /**\n   * 通过 ref 暴露 toggleFirstPreset()，供父组件调用。\n   * 对应 Vue defineExpose({ toggleFirstPreset })。\n   */\n  useImperativeHandle(\n    ref,\n    () => ({\n      toggleFirstPreset() {\n        handlePresetClick(RANGE_PRESETS[0]);\n      },\n    }),\n    [handlePresetClick],\n  );\n\n  // ── 渲染 ──────────────────────────────────────────────────────────────────\n\n  // 完整 picker 的可见性：展开状态 或 下拉面板打开时均显示\n  const pickerVisible = showFullPicker || open;\n\n  return (\n    <div className={styles.YkDateRangePicker} ref={wrapperRef}>\n      {/* ── 紧凑 Tag 模式 ── */}\n      {!showFullPicker && (\n        <span className={styles.yokaCompactTag} onClick={handleClickCompactTag}>\n          {/* 图标：绝对定位固定在左侧 */}\n          <i className={classNames('iconfont icon-riqi1', styles.yokaCompactTagIcon)} />\n          {/* 内容区：flex:1 + justify-content:center 实现视觉居中 */}\n          <span className={styles.yokaCompactTagContent}>\n            {activePreset ? (\n              // 已选预设：「预设名称 (格式化时间)」\n              <>\n                <span className={styles.yokaCompactTagPresetLabel}>{activePreset.label}</span>\n                <span className={styles.yokaCompactTagPresetFormat}>({presetFormatText})</span>\n              </>\n            ) : showState.length === 2 ? (\n              // 自定义时间：「起始时间 ~ 结束时间」\n              <>\n                <span className={styles.yokaCompactTagDatetime}>{showState[0]}</span>\n                <span className={styles.yokaCompactTagSeparator}>~</span>\n                <span className={styles.yokaCompactTagDatetime}>{showState[1]}</span>\n              </>\n            ) : (\n              // 无值/清空：placeholder 居中显示\n              <span className={styles.yokaCompactTagPlaceholder}>{placeholder}</span>\n            )}\n          </span>\n        </span>\n      )}\n\n      {/* ── 完整 RangePicker（display 切换以保持 DOM 挂载，避免 focus 闪烁） ── */}\n      <div className={styles.yokaPickerWrapper} style={{ display: pickerVisible ? 'flex' : 'none' }}>\n        <i className={classNames('iconfont icon-riqi1', styles.yokaPickerWrapperIcon)} />\n        <RangePicker\n          ref={pickerRef}\n          // 值与回调\n          value={value && value.length === 2 ? (value as [Dayjs, Dayjs]) : undefined}\n          onChange={handlePickerChange}\n          open={open}\n          onOpenChange={handleOpenChange}\n          // 外观\n          variant=\"borderless\"\n          allowClear={allowClear}\n          suffixIcon={null}\n          // 时间选择（支持秒）\n          showTime={{\n            format: 'HH:mm:ss',\n            hideDisabledOptions: true,\n            defaultValue: [dayjs('00:00', 'HH:mm'), dayjs('23:59', 'HH:mm')],\n          }}\n          format=\"YYYY-MM-DD HH:mm:ss\"\n          // 禁用日期\n          disabledDate={disabledDate}\n          // 预设（自定义渲染）\n          presets={presetsNode}\n          // Popup 容器\n          getPopupContainer={getPopupContainer}\n        />\n      </div>\n    </div>\n  );\n});\n\nYkDateRangePicker.displayName = 'YkDateRangePicker';\n\nexport default YkDateRangePicker;\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * YkDateRangePicker\n *\n * 带「紧凑预设 tag」与「完整 RangePicker」双模式切换的日期范围选择器。\n *\n * 功能特性：\n * - 默认紧凑模式：以 tag 形式展示「预设标签 + 格式化时间」或「起止时间」\n * - mount 时若无初始值，自动选中「近5分钟」预设\n * - 点击 tag 后展开内嵌的完整 RangePicker，失焦后自动收起\n * - 8 个内置快捷预设，2 列 Grid 布局渲染，当前激活项高亮\n * - 受控组件：区分「用户操作」与「外部赋值」，仅用户操作触发 onChange\n * - 禁用日期：仅允许过去 7 天（含今天）\n * - allowClear：支持一键清除，清除后重置预设状态\n * - 通过 forwardRef + useImperativeHandle 对外暴露 toggleFirstPreset()\n *\n * @example\n * ```tsx\n * const pickerRef = useRef<YkDateRangePickerRef>(null);\n *\n * <YkDateRangePicker\n *   value={range}\n *   onChange={(val) => setRange(val)}\n *   ref={pickerRef}\n * />\n *\n * // 外部强制切换到「近5分钟」\n * pickerRef.current?.toggleFirstPreset();\n * ```\n */\n\nimport { DatePicker } from 'antd';\nimport classNames from 'classnames';\nimport dayjs, { type Dayjs } from 'dayjs';\nimport React, {\n  type ComponentRef,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport styles from './index.module.less';\n\nconst { RangePicker } = DatePicker;\n\n// ─── 类型 ─────────────────────────────────────────────────────────────────────\n\n/** 时间范围值 */\nexport type DateRangeValue = [Dayjs, Dayjs];\n\n/**\n * 预设项定义\n * - value()  每次调用都返回最新时间，避免闭包缓存旧值\n * - format() 可选，控制紧凑 tag 中的格式化展示文本\n */\ninterface RangePreset {\n  label: string;\n  /** 工厂函数，返回实时时间范围 */\n  value: () => DateRangeValue;\n  /** 自定义紧凑模式格式化：返回单个字符串或 [start, end] 数组 */\n  format?: (value: DateRangeValue) => string | [string, string];\n}\n\nexport interface YkDateRangePickerProps {\n  /** 受控值 */\n  value?: DateRangeValue | [];\n  /** 用户操作改变时触发（外部 setValue 不会触发） */\n  onChange?: (value: DateRangeValue | null) => void;\n  /**\n   * 是否允许清除。\n   * - false（默认）：隐藏清除按钮，与 Vue 原版行为一致\n   * - true：显示清除按钮，清除后重置预设状态并触发 onChange(null)\n   */\n  allowClear?: boolean;\n  /**\n   * 紧凑 tag 无值/清空时的占位文本。\n   * 默认：「请选择时间范围」\n   */\n  placeholder?: string;\n  /** 是否禁用选择器 */\n  disabled?: boolean;\n  /** 校验状态 */\n  status?: '' | 'error' | 'warning';\n  /** 自定义类名 */\n  className?: string;\n  /** 自定义内联样式 */\n  style?: React.CSSProperties;\n}\n\n/** 通过 ref 对父组件暴露的方法 */\nexport interface YkDateRangePickerRef {\n  /** 强制切换到第一个预设（近5分钟）并触发 onChange */\n  toggleFirstPreset: () => void;\n}\n\n// ─── 工具函数 ─────────────────────────────────────────────────────────────────\n\n/** 精确到分钟的过去时间区间 */\nfunction pastTime(n: number, unit: dayjs.ManipulateType): DateRangeValue {\n  const fmt = 'YYYY-MM-DD HH:mm:ss';\n  return [dayjs(dayjs().subtract(n, unit).format(fmt)), dayjs(dayjs().format(fmt))];\n}\n\nconst DISPLAY_FORMAT = 'YYYY-MM-DD HH:mm:ss';\n\n/** 格式化 Dayjs 为紧凑模式展示字符串 / 预设匹配字符串 */\nfunction formatToKey(d: Dayjs): string {\n  return dayjs(d).format(DISPLAY_FORMAT);\n}\n\n/** 深度比较两个 value 是否「语义相同」（忽略 Dayjs 引用差异） */\nfunction isValueEqual(a: DateRangeValue | [] | undefined, b: DateRangeValue | [] | undefined): boolean {\n  if (a === b) return true;\n  if (!a || !b) return a === b;\n  if (a.length !== b.length) return false;\n  if (a.length < 2 || b.length < 2) return a.length === b.length;\n  return (\n    formatToKey(a[0] as Dayjs) === formatToKey(b[0] as Dayjs) &&\n    formatToKey(a[1] as Dayjs) === formatToKey(b[1] as Dayjs)\n  );\n}\n\n// ─── 内置预设列表 ─────────────────────────────────────────────────────────────\n\n/**\n * 8 个内置快捷预设。\n * value 始终是工厂函数，保证每次点击都获取最新的当前时间。\n */\nconst RANGE_PRESETS: RangePreset[] = [\n  {\n    label: '近5分钟',\n    value: () => pastTime(5, 'minute'),\n  },\n  {\n    label: '近15分钟',\n    value: () => pastTime(15, 'minute'),\n  },\n  {\n    label: '近30分钟',\n    value: () => pastTime(30, 'minute'),\n  },\n  {\n    label: '近1小时',\n    value: () => pastTime(1, 'hour'),\n  },\n  {\n    label: '近2小时',\n    value: () => pastTime(2, 'hour'),\n  },\n  {\n    label: '近6小时',\n    value: () => pastTime(6, 'hour'),\n  },\n  {\n    label: '今天',\n    value: () =>\n      [\n        dayjs(dayjs().startOf('day').format('YYYY-MM-DD HH:mm:ss')),\n        dayjs(dayjs().endOf('day').format('YYYY-MM-DD HH:mm:ss')),\n      ] as DateRangeValue,\n    // 紧凑模式只展示日期，如「03-25」\n    format: (v) => v[0].format('MM-DD'),\n  },\n  {\n    label: '昨天',\n    value: () =>\n      [\n        dayjs(dayjs().subtract(1, 'day').startOf('day').format('YYYY-MM-DD HH:mm:ss')),\n        dayjs(dayjs().subtract(1, 'day').endOf('day').format('YYYY-MM-DD HH:mm:ss')),\n      ] as DateRangeValue,\n    format: (v) => v[0].format('MM-DD'),\n  },\n  {\n    label: '近7天',\n    value: () =>\n      [\n        dayjs(dayjs().subtract(6, 'day').startOf('day').format('YYYY-MM-DD HH:mm:ss')),\n        dayjs(dayjs().endOf('day').format('YYYY-MM-DD HH:mm:ss')),\n      ] as DateRangeValue,\n    // 紧凑模式展示完整日期区间，如「2024-03-19 ~ 2024-03-25」\n    format: (v) => [v[0].format('YYYY-MM-DD'), v[1].format('YYYY-MM-DD')],\n  },\n];\n\n// ─── 主组件 ───────────────────────────────────────────────────────────────────\n\nconst YkDateRangePicker = forwardRef<YkDateRangePickerRef, YkDateRangePickerProps>(function YkDateRangePicker(\n  {\n    value,\n    onChange,\n    allowClear = false,\n    placeholder = '请选择时间范围',\n    disabled = false,\n    status = '',\n    className,\n    style,\n  },\n  ref,\n) {\n  // ── 内部状态 ───────────────────────────────────────────────────────────────\n\n  /** 是否展示完整 RangePicker（false = 紧凑 tag 模式） */\n  const [showFullPicker, setShowFullPicker] = useState(false);\n\n  /** RangePicker 下拉面板是否展开 */\n  const [open, setOpen] = useState(false);\n\n  /**\n   * 当前激活的预设定义引用。\n   * undefined 表示用户手动选了自定义时间范围。\n   */\n  const [activePreset, setActivePreset] = useState<RangePreset | undefined>(undefined);\n\n  /**\n   * 紧凑 tag 中预设的格式化文本。\n   * 例：「12:00:00 ~ 13:00:00」或「03-25」或「2024-03-19 ~ 2024-03-25」\n   */\n  const [presetFormatText, setPresetFormatText] = useState<string | undefined>(undefined);\n\n  // ── Refs ───────────────────────────────────────────────────────────────────\n\n  /**\n   * 标记本次 value 变化是否由用户操作触发（非外部赋值）。\n   * 用 ref 而非 state，避免触发额外的重渲染。\n   * 与 Vue 版 selfChange 逻辑一致。\n   */\n  const selfChangeRef = useRef(false);\n\n  /**\n   * 标记当前 RangePicker.onChange 是否由预设点击触发。\n   * 用于区分「预设点击」vs「手动选择」，避免手动选择时错误保留预设状态。\n   */\n  const isPresetClickRef = useRef(false);\n\n  /** 管理 setTimeout，防止竞态 */\n  const collapseTimerRef = useRef<ReturnType<typeof setTimeout>>();\n\n  /** 组件根元素，用作 getPopupContainer */\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  /** RangePicker 实例 ref，用于编程式展开面板 */\n  const pickerRef = useRef<ComponentRef<typeof RangePicker>>(null);\n\n  /** 缓存上一次的 value，用于判断是否是外部变更 */\n  const prevValueRef = useRef(value);\n\n  /** 延迟收起完整 picker，清除旧定时器避免竞态 */\n  const scheduleCollapse = useCallback((delay?: number) => {\n    clearTimeout(collapseTimerRef.current);\n    collapseTimerRef.current = setTimeout(() => {\n      setOpen(false);\n      setShowFullPicker(false);\n    }, delay ?? 0);\n  }, []);\n\n  /** 卸载时清理定时器 */\n  useEffect(() => () => clearTimeout(collapseTimerRef.current), []);\n\n  // ── 默认值：mount 时无初始 value 则自动选中「近5分钟」 ───────────────────\n\n  useEffect(() => {\n    // 仅在外部未传有效初始值时执行一次\n    if (value && (value as DateRangeValue).length === 2) return;\n\n    const first = RANGE_PRESETS[0];\n    const currentValue = first.value();\n    const formatText = currentValue.map((v) => dayjs(v).format('HH:mm:ss')).join(' ~ ');\n\n    setActivePreset(first);\n    setPresetFormatText(formatText);\n\n    // 标记为用户操作，避免被下方的外部 value 监听 effect 清空预设状态\n    selfChangeRef.current = true;\n    onChange?.(currentValue);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  // ── 外部 value 变化同步 ────────────────────────────────────────────────────\n\n  useEffect(() => {\n    // 跳过初始 mount（value 未真正变化）\n    if (isValueEqual(prevValueRef.current, value)) return;\n    prevValueRef.current = value;\n\n    if (!selfChangeRef.current) {\n      // 外部 setField 赋值：清空预设状态（无法得知外部值对应哪个预设）\n      setActivePreset(undefined);\n      setPresetFormatText(undefined);\n    }\n    // 消费掉标记，等待下次用户操作重新置位\n    selfChangeRef.current = false;\n  }, [value]);\n\n  // ── 紧凑 tag 展示文本 ──────────────────────────────────────────────────────\n\n  /**\n   * 紧凑模式下起止时间的字符串表示。\n   * 与 Vue showState 计算属性逻辑一致。\n   */\n  const showState = useMemo<[string, string] | []>(() => {\n    if (!value || value.length < 2) return [];\n    return [formatToKey(value[0] as Dayjs), formatToKey(value[1] as Dayjs)];\n  }, [value]);\n\n  // ── 预设激活项检测 ─────────────────────────────────────────────────────────\n\n  /**\n   * 根据当前 value 匹配激活的预设 index（用于高亮渲染）。\n   * 将 value 和预设值都格式化为同一字符串后比对，与 Vue presetsNode computed 一致。\n   * 依赖 open，确保面板打开时（时间流逝后）重新计算。\n   */\n  const activePresetIndex = useMemo<number>(() => {\n    if (!value || value.length < 2) return -1;\n    const [v0, v1] = value as DateRangeValue;\n    const valKeys = [formatToKey(v0), formatToKey(v1)];\n    return RANGE_PRESETS.findIndex((preset) => {\n      const presetVal = preset.value();\n      const presetKeys = [formatToKey(presetVal[0]), formatToKey(presetVal[1])];\n      return valKeys[0] === presetKeys[0] && valKeys[1] === presetKeys[1];\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [value, open]);\n\n  // ── 事件处理 ──────────────────────────────────────────────────────────────\n\n  /**\n   * 点击预设项。\n   * 对应 Vue handleTogglePreset。\n   */\n  const handlePresetClick = useCallback(\n    (preset: RangePreset) => {\n      isPresetClickRef.current = true;\n\n      const currentValue = preset.value();\n\n      // 计算紧凑 tag 中的格式化文本\n      let formatText: string;\n      if (preset.format) {\n        const res = preset.format(currentValue);\n        formatText = Array.isArray(res) ? res.join(' ~ ') : res;\n      } else {\n        // 无自定义 format：默认展示时间部分，如「12:00:00 ~ 13:00:00」\n        formatText = currentValue.map((v) => dayjs(v).format('HH:mm:ss')).join(' ~ ');\n      }\n\n      setActivePreset(preset);\n      setPresetFormatText(formatText);\n\n      // 向父组件通知新值\n      selfChangeRef.current = true;\n      onChange?.(currentValue);\n\n      // 选完预设后收起 picker\n      scheduleCollapse();\n    },\n    [onChange],\n  );\n\n  /**\n   * RangePicker onChange（用户手动选择日期或点击清除后触发）。\n   * 对应 Vue handleChange。\n   */\n  const handlePickerChange = useCallback(\n    (dates: [Dayjs | null, Dayjs | null] | null) => {\n      // 无论是否预设点击，只要触发 change 都先清空预设状态\n      setActivePreset(undefined);\n      setPresetFormatText(undefined);\n      isPresetClickRef.current = false;\n\n      selfChangeRef.current = true;\n\n      if (dates?.[0] && dates?.[1]) {\n        // 正常选择\n        onChange?.(dates as DateRangeValue);\n      } else {\n        // 点击清除：value 置为 []（空数组），并退回紧凑 tag 模式显示 placeholder\n        onChange?.(null);\n        scheduleCollapse();\n      }\n    },\n    [onChange],\n  );\n\n  /**\n   * 点击紧凑 tag → 展开完整 RangePicker 并聚焦。\n   * 对应 Vue handleClickPresetPicker。\n   */\n  /** 模拟按钮激活行为，同时支持鼠标点击和键盘回车/空格 */\n  const activateCompactTag = useCallback(() => {\n    setShowFullPicker(true);\n    // 等待 DOM 渲染后再触发 picker 展开\n    setTimeout(() => {\n      const el = pickerRef.current?.nativeElement;\n      if (el) {\n        // 触发第一个 input 的点击，使 antd RangePicker 展开面板\n        const input = el.querySelector<HTMLInputElement>('input');\n        input?.click();\n        input?.focus();\n      }\n    }, 0);\n  }, []);\n\n  /**\n   * RangePicker 面板开关回调。\n   * 面板关闭时延迟退回紧凑模式（避免与选择操作冲突）。\n   */\n  const handleOpenChange = useCallback(\n    (isOpen: boolean) => {\n      setOpen(isOpen);\n      if (!isOpen) {\n        scheduleCollapse(150);\n      }\n    },\n    [scheduleCollapse],\n  );\n\n  /**\n   * 禁用日期规则：只允许过去 7 天（含今天）。\n   * 对应 Vue disabledDate。\n   */\n  const disabledDate = useCallback((current: Dayjs) => {\n    return current && (current > dayjs().endOf('day') || current < dayjs().subtract(6, 'day').startOf('day'));\n  }, []);\n\n  /**\n   * Popup 挂载容器：挂在组件自身 wrapper 内，避免全局定位错乱。\n   * 对应 Vue getPopupContainer。\n   */\n  const getPopupContainer = useCallback((): HTMLElement => {\n    return wrapperRef.current ?? document.body;\n  }, []);\n\n  // ── antd presets 节点 ──────────────────────────────────────────────────────\n\n  /**\n   * 构建传入 RangePicker 的 presets prop。\n   * - label 为自定义 ReactNode，实现点击处理与高亮样式\n   * - value 传实时值供 antd 内部使用（如 disabledDate 校验）\n   * antd 5.x presets 格式：{ label: ReactNode; value: [Dayjs, Dayjs] }[]\n   */\n  const presetsNode = useMemo(() => {\n    return RANGE_PRESETS.map((preset, index) => {\n      const isActive = activePresetIndex === index;\n      return {\n        label: (\n          <div\n            className={classNames(styles.yokaPresetItem, {\n              [styles.yokaPresetItemActive]: isActive,\n            })}\n            role='option'\n            tabIndex={0}\n            aria-selected={isActive}\n            onClick={(e) => {\n              e.stopPropagation();\n              handlePresetClick(preset);\n            }}\n            onKeyDown={(e) => {\n              if (e.key === 'Enter' || e.key === ' ') {\n                e.preventDefault();\n                e.stopPropagation();\n                handlePresetClick(preset);\n              }\n            }}\n          >\n            {preset.label}\n          </div>\n        ),\n        value: preset.value() as [Dayjs, Dayjs],\n      };\n    });\n  }, [activePresetIndex, handlePresetClick]);\n\n  // ── 对外暴露方法 ───────────────────────────────────────────────────────────\n\n  /**\n   * 通过 ref 暴露 toggleFirstPreset()，供父组件调用。\n   * 对应 Vue defineExpose({ toggleFirstPreset })。\n   */\n  useImperativeHandle(\n    ref,\n    () => ({\n      toggleFirstPreset() {\n        handlePresetClick(RANGE_PRESETS[0]);\n      },\n    }),\n    [handlePresetClick],\n  );\n\n  // ── 渲染 ──────────────────────────────────────────────────────────────────\n\n  // 完整 picker 的可见性：展开状态 或 下拉面板打开时均显示\n  const pickerVisible = showFullPicker || open;\n\n  return (\n    <div\n      className={classNames(styles.YkDateRangePicker, className, {\n        [styles.yokaDisabled]: disabled,\n      })}\n      ref={wrapperRef}\n    >\n      {/* ── 紧凑 Tag 模式 ── */}\n      {!showFullPicker && (\n        <span\n          className={styles.yokaCompactTag}\n          style={style}\n          role='button'\n          tabIndex={disabled ? -1 : 0}\n          aria-haspopup='dialog'\n          aria-expanded={open}\n          aria-disabled={disabled}\n          onClick={disabled ? undefined : activateCompactTag}\n          onKeyDown={(e) => {\n            if (disabled) return;\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault();\n              activateCompactTag();\n            }\n          }}\n        >\n          {/* 图标：绝对定位固定在左侧 */}\n          <i className={classNames('iconfont icon-riqi1', styles.yokaCompactTagIcon)} />\n          {/* 内容区：flex:1 + justify-content:center 实现视觉居中 */}\n          <span className={styles.yokaCompactTagContent}>\n            {activePreset ? (\n              // 已选预设：「预设名称 (格式化时间)」\n              <>\n                <span className={styles.yokaCompactTagPresetLabel}>{activePreset.label}</span>\n                <span className={styles.yokaCompactTagPresetFormat}>({presetFormatText})</span>\n              </>\n            ) : showState.length === 2 ? (\n              // 自定义时间：「起始时间 ~ 结束时间」\n              <>\n                <span className={styles.yokaCompactTagDatetime}>{showState[0]}</span>\n                <span className={styles.yokaCompactTagSeparator}>~</span>\n                <span className={styles.yokaCompactTagDatetime}>{showState[1]}</span>\n              </>\n            ) : (\n              // 无值/清空：placeholder 居中显示\n              <span className={styles.yokaCompactTagPlaceholder}>{placeholder}</span>\n            )}\n          </span>\n        </span>\n      )}\n\n      {/* ── 完整 RangePicker（display 切换以保持 DOM 挂载，避免 focus 闪烁） ── */}\n      <div className={styles.yokaPickerWrapper} style={{ display: pickerVisible ? 'flex' : 'none' }}>\n        <i className={classNames('iconfont icon-riqi1', styles.yokaPickerWrapperIcon)} />\n        <RangePicker\n          ref={pickerRef}\n          // 值与回调\n          value={value && value.length === 2 ? (value as [Dayjs, Dayjs]) : undefined}\n          onChange={handlePickerChange}\n          open={open}\n          onOpenChange={handleOpenChange}\n          // 外观\n          variant='borderless'\n          allowClear={allowClear}\n          disabled={disabled}\n          status={status || undefined}\n          suffixIcon={null}\n          // 时间选择（支持秒）\n          showTime={{\n            format: 'HH:mm:ss',\n            hideDisabledOptions: true,\n            defaultValue: [dayjs('00:00', 'HH:mm'), dayjs('23:59', 'HH:mm')],\n          }}\n          format='YYYY-MM-DD HH:mm:ss'\n          // 禁用日期\n          disabledDate={disabledDate}\n          // 预设（自定义渲染）\n          presets={presetsNode}\n          // Popup 容器\n          getPopupContainer={getPopupContainer}\n          classNames={{ popup: { root: 'yoka-daterangepicker-popup' } }}\n        />\n      </div>\n    </div>\n  );\n});\n\nYkDateRangePicker.displayName = 'YkDateRangePicker';\n\nexport default YkDateRangePicker;\n"],
+  "mappings": "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",
   "names": ["dayjs", "YkDateRangePicker", "React", "classNames", "styles"]
 }

package/dist/lib/components/YkDateRangePicker/index.module.less

@@ -24,7 +24,8 @@
   align-items: center;
   /* 图标绝对定位后，内容区可以真正居中 */
   position: relative;
-  min-width: 220px;
+  /* 继承父容器宽度（当用户传入自定义 width 时），避免切换时伸缩 */
+  min-width: 260px;
   height: 30px;
   padding: 0 10px 0 32px; /* 左侧为图标留出空间 */
   border: 1px solid #1890ff;
@@ -150,11 +151,12 @@
 
 /*
  * 需要穿透 antd 在 body 下生成的 .ant-picker-dropdown Portal。
- * 使用 :global 显式声明全局样式作用域。
+ * 使用 :global 显式声明全局样式作用域，通过 .yoka-daterangepicker-popup 类名
+ * 限定为仅影响本组件实例的下拉面板，避免全局样式污染。
  */
 
 :global {
-  .ant-picker-panel-layout {
+  .yoka-daterangepicker-popup .ant-picker-panel-layout {
     .ant-picker-presets {
       ul {
         display: grid;
@@ -196,19 +198,19 @@
     }
   }
   /* antd 5.x: 快捷预设面板的列表容器 */
-  .ant-picker-dropdown .ant-picker-presets {
+  .yoka-daterangepicker-popup .ant-picker-presets {
     max-height: none !important;
     overflow: hidden !important;
     display: flex !important;
     flex-direction: column !important;
   }
 
-  .ant-picker-dropdown .ant-picker-presets li {
+  .yoka-daterangepicker-popup .ant-picker-presets li {
     overflow: hidden !important;
     text-overflow: ellipsis !important;
   }
 
-  .ant-picker-dropdown .ant-picker-presets ul {
+  .yoka-daterangepicker-popup .ant-picker-presets ul {
     display: grid !important;
     grid-template-columns: repeat(2, 1fr) !important;
     width: auto !important;
@@ -220,7 +222,7 @@
     flex-wrap: wrap !important;
   }
 
-  .ant-picker-dropdown .ant-picker-presets ul li {
+  .yoka-daterangepicker-popup .ant-picker-presets ul li {
     margin: 0 !important;
     padding: 0 !important;
     width: 100% !important;
@@ -234,12 +236,12 @@
   }
 
   /* 最后一个预设项不加底部 margin（对应 Vue li:last-of-type 规则） */
-  .ant-picker-dropdown .ant-picker-presets li:last-of-type {
+  .yoka-daterangepicker-popup .ant-picker-presets li:last-of-type {
     margin-bottom: 0 !important;
   }
 
   /* 快捷选项底部操作栏行高（缩减后与面板整体协调） */
-  .ant-picker-dropdown .ant-picker-ranges {
+  .yoka-daterangepicker-popup .ant-picker-ranges {
     line-height: 36px;
     overflow: hidden !important;
   }
@@ -264,10 +266,15 @@
   font-size: 12px;
   color: rgba(0, 0, 0, 0.88);
   line-height: 1;
+  outline: none;
 
   &:hover {
     background-color: #f5f5f5;
   }
+
+  &:focus-visible {
+    box-shadow: 0 0 0 2px rgba(5, 138, 255, 0.2);
+  }
 }
 
 /* 当前激活（选中）的预设高亮 */
@@ -279,3 +286,20 @@
     background-color: #bae7ff;
   }
 }
+
+/* ─── 禁用状态 ────────────────────────────────────────────────────────── */
+
+.yokaDisabled {
+  pointer-events: none;
+  opacity: 0.5;
+
+  .yokaCompactTag,
+  .yokaPickerWrapper {
+    cursor: not-allowed;
+    border-color: #d9d9d9;
+
+    &:hover {
+      border-color: #d9d9d9;
+    }
+  }
+}

package/dist/lib/components/YkRangeDateWithVS/YkRangeDateWithVSCompare.d.ts

@@ -1,4 +1,4 @@
-import { Dayjs } from 'dayjs';
+import { type Dayjs } from 'dayjs';
 import React from 'react';
 type DateValue = Dayjs | null;
 type RangeValue = [DateValue, DateValue] | null;

package/dist/lib/components/YkRangeDateWithVS/YkRangeDateWithVSCompare.js

@@ -37,8 +37,8 @@ var import_zh_CN = __toESM(require("antd/es/date-picker/locale/zh_CN"));
 var import_classnames = __toESM(require("classnames"));
 var import_dayjs = __toESM(require("dayjs"));
 var import_react = __toESM(require("react"));
-var import_YkRangeDateWithVSSelect = __toESM(require("./YkRangeDateWithVSSelect"));
 var import_styles = __toESM(require("./styles"));
+var import_YkRangeDateWithVSSelect = __toESM(require("./YkRangeDateWithVSSelect"));
 var itemCheckIconClass = (className) => {
   return (0, import_classnames.default)("iconfont", className, import_styles.default.active);
 };
@@ -189,10 +189,11 @@ var YkRangeDateWithVSCompare = ({
             setHasDate(true);
             setDateOpen(true);
             break;
-          default:
+          default: {
             const arr = checkDate(Number(v.value));
             onChange({ rangeDate: arr });
             break;
+          }
         }
       }
     },

package/dist/lib/components/YkRangeDateWithVS/YkRangeDateWithVSCompare.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/YkRangeDateWithVS/YkRangeDateWithVSCompare.tsx"],
-  "sourcesContent": ["import type { DatePickerProps } from 'antd';\nimport { DatePicker, Tooltip } from 'antd';\nimport datePickerZhCN from 'antd/es/date-picker/locale/zh_CN';\nimport classNames from 'classnames';\nimport dayjs, { Dayjs } from 'dayjs';\nimport React, { useEffect, useState } from 'react';\nimport YkRangeDateWithVSSelect from './YkRangeDateWithVSSelect';\nimport styles from './styles';\ntype DateValue = Dayjs | null;\ntype RangeValue = [DateValue, DateValue] | null;\ntype optionsType = {\n  label: string;\n  value: number | string;\n  filter: string[];\n};\n\nconst itemCheckIconClass = (className: string) => {\n  return classNames('iconfont', className, styles.active);\n};\nconst shortcutClass = (v: boolean) => {\n  return classNames(\n    {\n      [styles.checked]: v,\n    },\n    styles.ykRangeDateWithVsShortcutItem,\n  );\n};\n\nexport interface YkRangeDateWithVSCompareProps {\n  timeType: string;\n  rangeDate: [DateValue, DateValue];\n  originDate: RangeValue;\n  dayLine: number;\n  disableCompare?: boolean;\n  onChange: (value: { rangeDate: RangeValue }) => void;\n}\n\nconst comparedOptions: optionsType[] = [\n  { label: '前一日', value: 1, filter: ['date'] },\n  { label: '前一周', value: 7, filter: ['date', 'week'] },\n  { label: '前一月', value: 30, filter: ['date', 'week', 'month'] },\n  { label: '自定义时间', value: 'customize', filter: ['date', 'week', 'month'] },\n];\nconst pickerMap: {\n  [key: string]: 'date' | 'week' | 'month';\n} = {\n  按自然周: 'week',\n  按自然月: 'month',\n  按周: 'week',\n  按月: 'month',\n};\n\nconst YkRangeDateWithVSCompare: React.FC<YkRangeDateWithVSCompareProps> = ({\n  timeType,\n  rangeDate,\n  originDate,\n  dayLine,\n  onChange,\n  disableCompare = false,\n}) => {\n  const [hasDate, setHasDate] = useState(false);\n  const [dateOpen, setDateOpen] = useState(false);\n  const [cacheStartTime, setCacheStartTime] = useState<DateValue | null>(null);\n  const [comparedIndex, setComparedIndex] = useState<number | null>(null);\n  const picker = pickerMap[timeType] || 'date';\n  const options = comparedOptions\n    .filter((v) => {\n      return v.filter.includes(picker);\n    })\n    .map((v) => ({\n      label: v.label,\n      value: v.value,\n    }));\n\n  useEffect(() => {\n    if (rangeDate && rangeDate[0] && rangeDate[1]) {\n      setHasDate(true);\n      setCacheStartTime(rangeDate[0]);\n    }\n  }, [rangeDate]);\n\n  useEffect(() => {\n    if (dateOpen && originDate && originDate[0] && cacheStartTime) {\n      const num = originDate[0].diff(cacheStartTime, 'day');\n      setComparedIndex(\n        options.findIndex((v) => {\n          return v.value === num;\n        }),\n      );\n    } else {\n      setComparedIndex(null);\n    }\n  }, [dateOpen]);\n\n  const checkDate = (n: number) => {\n    const arr: [DateValue, DateValue] = [null, null];\n    if (originDate && originDate[0] && originDate[1]) {\n      arr[0] = dayjs(originDate[0]).add(-n, 'day');\n      dayjs(originDate[1]).add(-n) > dayjs().endOf('day')\n        ? (arr[1] = dayjs(originDate[1]))\n        : (arr[1] = dayjs(originDate[1]).add(-n, 'day'));\n    }\n    return arr;\n  };\n\n  const customFormat: DatePickerProps['format'] = (value) => {\n    const endTime =\n      dayjs(value).add(dayLine, 'day') > dayjs().endOf('day')\n        ? dayjs().format('YYYY-MM-DD')\n        : dayjs(value).add(dayLine, 'day').format('YYYY-MM-DD');\n    return `${dayjs(value).format('YYYY-MM-DD')} ~ ${endTime}`;\n  };\n\n  const dateRender = (panelNode: React.ReactNode) => {\n    return (\n      <div className={styles.ykRangeDateWithVsGroup}>\n        <div className={styles.ykRangeDateWithVsShortcut}>\n          <div className={styles.ykRangeDateWithVsShortcutContent}>\n            {options\n              .filter((v) => v.value !== 'customize')\n              .map((v, i) => (\n                <span\n                  onClick={() => {\n                    const arr = checkDate(Number(v.value));\n                    setComparedIndex(i);\n                    if (arr[0]) {\n                      const endTime =\n                        arr[0].add(dayLine, 'day') > dayjs().endOf('day') ? dayjs() : arr[0].add(dayLine, 'day');\n                      onChange({\n                        rangeDate: [arr[0], endTime],\n                      });\n                    }\n                    setDateOpen(false);\n                  }}\n                  key={v.label}\n                  className={shortcutClass(comparedIndex === i)}\n                >\n                  {v.label}\n                </span>\n              ))}\n          </div>\n        </div>\n        <div>{panelNode}</div>\n      </div>\n    );\n  };\n\n  return (\n    <div className={styles.globalMl}>\n      {hasDate ? (\n        <div style={{ display: 'flex' }}>\n          <i className={classNames('iconfont icon-duibi', styles.globalDuibiIcon)} />\n          <div className={classNames(styles.globalMl, styles.globalItem, styles.globalItemChecked)}>\n            <i className={itemCheckIconClass('')} />\n            <DatePicker\n              locale={datePickerZhCN}\n              classNames={{\n                popup: {\n                  root: styles.globalItemDatePanel,\n                },\n              }}\n              getPopupContainer={(triggerNode) => triggerNode.parentNode as HTMLElement}\n              disabledDate={(current) => {\n                return current && current > dayjs().endOf('day');\n              }}\n              picker={picker}\n              value={cacheStartTime}\n              open={dateOpen}\n              placeholder='开始日期'\n              className={styles.globalItemDateSingle}\n              variant='borderless'\n              showNow={false}\n              allowClear={false}\n              suffixIcon={false}\n              panelRender={dateRender}\n              format={customFormat}\n              onChange={(val) => {\n                setCacheStartTime(val);\n                const endTime = val.add(dayLine, 'day') > dayjs().endOf('day') ? dayjs() : val.add(dayLine, 'day');\n                onChange({\n                  rangeDate: [val, endTime],\n                });\n              }}\n              onOpenChange={(flag: boolean) => {\n                setDateOpen(flag);\n              }}\n            />\n            <div className={styles.globalItemDateDel}>\n              <i\n                className={classNames('iconfont icon-guanbi2')}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  onChange({ rangeDate: [null, null] });\n                  setHasDate(false);\n                  setCacheStartTime(null);\n                }}\n              ></i>\n            </div>\n          </div>\n        </div>\n      ) : (\n        <YkRangeDateWithVSSelect\n          options={options}\n          disabled={disableCompare}\n          onChange={(v) => {\n            switch (v.value) {\n              case 'customize':\n                setHasDate(true);\n                setDateOpen(true);\n                // setIsFocus(true);\n                break;\n              default:\n                const arr = checkDate(Number(v.value));\n                onChange({ rangeDate: arr });\n                break;\n            }\n          }}\n        >\n          <Tooltip\n            placement='top'\n            title={\n              disableCompare\n                ? '日期对比不支持细分'\n                : picker === 'month'\n                  ? '实际数据为选择的日期所在月份的整月数据'\n                  : null\n            }\n            color='#fff'\n            styles={{\n              body: {\n                color: '#333',\n              },\n            }}\n          >\n            <div\n              className={classNames(styles.globalMl, styles.globalItem, disableCompare ? styles.globalDisabled : '')}\n            >\n              <i className={itemCheckIconClass('icon-jiahao2')} />\n              <div>日期对比</div>\n            </div>\n          </Tooltip>\n        </YkRangeDateWithVSSelect>\n      )}\n    </div>\n  );\n};\n\nexport default YkRangeDateWithVSCompare;\n"],
-  "mappings": "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",
+  "sourcesContent": ["import type { DatePickerProps } from 'antd';\nimport { DatePicker, Tooltip } from 'antd';\nimport datePickerZhCN from 'antd/es/date-picker/locale/zh_CN';\nimport classNames from 'classnames';\nimport dayjs, { type Dayjs } from 'dayjs';\nimport React, { useEffect, useState } from 'react';\nimport styles from './styles';\nimport YkRangeDateWithVSSelect from './YkRangeDateWithVSSelect';\n\ntype DateValue = Dayjs | null;\ntype RangeValue = [DateValue, DateValue] | null;\ntype optionsType = {\n  label: string;\n  value: number | string;\n  filter: string[];\n};\n\nconst itemCheckIconClass = (className: string) => {\n  return classNames('iconfont', className, styles.active);\n};\nconst shortcutClass = (v: boolean) => {\n  return classNames(\n    {\n      [styles.checked]: v,\n    },\n    styles.ykRangeDateWithVsShortcutItem,\n  );\n};\n\nexport interface YkRangeDateWithVSCompareProps {\n  timeType: string;\n  rangeDate: [DateValue, DateValue];\n  originDate: RangeValue;\n  dayLine: number;\n  disableCompare?: boolean;\n  onChange: (value: { rangeDate: RangeValue }) => void;\n}\n\nconst comparedOptions: optionsType[] = [\n  { label: '前一日', value: 1, filter: ['date'] },\n  { label: '前一周', value: 7, filter: ['date', 'week'] },\n  { label: '前一月', value: 30, filter: ['date', 'week', 'month'] },\n  { label: '自定义时间', value: 'customize', filter: ['date', 'week', 'month'] },\n];\nconst pickerMap: {\n  [key: string]: 'date' | 'week' | 'month';\n} = {\n  按自然周: 'week',\n  按自然月: 'month',\n  按周: 'week',\n  按月: 'month',\n};\n\nconst YkRangeDateWithVSCompare: React.FC<YkRangeDateWithVSCompareProps> = ({\n  timeType,\n  rangeDate,\n  originDate,\n  dayLine,\n  onChange,\n  disableCompare = false,\n}) => {\n  const [hasDate, setHasDate] = useState(false);\n  const [dateOpen, setDateOpen] = useState(false);\n  const [cacheStartTime, setCacheStartTime] = useState<DateValue | null>(null);\n  const [comparedIndex, setComparedIndex] = useState<number | null>(null);\n  const picker = pickerMap[timeType] || 'date';\n  const options = comparedOptions\n    .filter((v) => {\n      return v.filter.includes(picker);\n    })\n    .map((v) => ({\n      label: v.label,\n      value: v.value,\n    }));\n\n  useEffect(() => {\n    if (rangeDate && rangeDate[0] && rangeDate[1]) {\n      setHasDate(true);\n      setCacheStartTime(rangeDate[0]);\n    }\n  }, [rangeDate]);\n\n  useEffect(() => {\n    if (dateOpen && originDate && originDate[0] && cacheStartTime) {\n      const num = originDate[0].diff(cacheStartTime, 'day');\n      setComparedIndex(\n        options.findIndex((v) => {\n          return v.value === num;\n        }),\n      );\n    } else {\n      setComparedIndex(null);\n    }\n  }, [dateOpen]);\n\n  const checkDate = (n: number) => {\n    const arr: [DateValue, DateValue] = [null, null];\n    if (originDate && originDate[0] && originDate[1]) {\n      arr[0] = dayjs(originDate[0]).add(-n, 'day');\n      dayjs(originDate[1]).add(-n) > dayjs().endOf('day')\n        ? (arr[1] = dayjs(originDate[1]))\n        : (arr[1] = dayjs(originDate[1]).add(-n, 'day'));\n    }\n    return arr;\n  };\n\n  const customFormat: DatePickerProps['format'] = (value) => {\n    const endTime =\n      dayjs(value).add(dayLine, 'day') > dayjs().endOf('day')\n        ? dayjs().format('YYYY-MM-DD')\n        : dayjs(value).add(dayLine, 'day').format('YYYY-MM-DD');\n    return `${dayjs(value).format('YYYY-MM-DD')} ~ ${endTime}`;\n  };\n\n  const dateRender = (panelNode: React.ReactNode) => {\n    return (\n      <div className={styles.ykRangeDateWithVsGroup}>\n        <div className={styles.ykRangeDateWithVsShortcut}>\n          <div className={styles.ykRangeDateWithVsShortcutContent}>\n            {options\n              .filter((v) => v.value !== 'customize')\n              .map((v, i) => (\n                <span\n                  onClick={() => {\n                    const arr = checkDate(Number(v.value));\n                    setComparedIndex(i);\n                    if (arr[0]) {\n                      const endTime =\n                        arr[0].add(dayLine, 'day') > dayjs().endOf('day') ? dayjs() : arr[0].add(dayLine, 'day');\n                      onChange({\n                        rangeDate: [arr[0], endTime],\n                      });\n                    }\n                    setDateOpen(false);\n                  }}\n                  key={v.label}\n                  className={shortcutClass(comparedIndex === i)}\n                >\n                  {v.label}\n                </span>\n              ))}\n          </div>\n        </div>\n        <div>{panelNode}</div>\n      </div>\n    );\n  };\n\n  return (\n    <div className={styles.globalMl}>\n      {hasDate ? (\n        <div style={{ display: 'flex' }}>\n          <i className={classNames('iconfont icon-duibi', styles.globalDuibiIcon)} />\n          <div className={classNames(styles.globalMl, styles.globalItem, styles.globalItemChecked)}>\n            <i className={itemCheckIconClass('')} />\n            <DatePicker\n              locale={datePickerZhCN}\n              classNames={{\n                popup: {\n                  root: styles.globalItemDatePanel,\n                },\n              }}\n              getPopupContainer={(triggerNode) => triggerNode.parentNode as HTMLElement}\n              disabledDate={(current) => {\n                return current && current > dayjs().endOf('day');\n              }}\n              picker={picker}\n              value={cacheStartTime}\n              open={dateOpen}\n              placeholder='开始日期'\n              className={styles.globalItemDateSingle}\n              variant='borderless'\n              showNow={false}\n              allowClear={false}\n              suffixIcon={false}\n              panelRender={dateRender}\n              format={customFormat}\n              onChange={(val) => {\n                setCacheStartTime(val);\n                const endTime = val.add(dayLine, 'day') > dayjs().endOf('day') ? dayjs() : val.add(dayLine, 'day');\n                onChange({\n                  rangeDate: [val, endTime],\n                });\n              }}\n              onOpenChange={(flag: boolean) => {\n                setDateOpen(flag);\n              }}\n            />\n            <div className={styles.globalItemDateDel}>\n              <i\n                className={classNames('iconfont icon-guanbi2')}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  onChange({ rangeDate: [null, null] });\n                  setHasDate(false);\n                  setCacheStartTime(null);\n                }}\n              ></i>\n            </div>\n          </div>\n        </div>\n      ) : (\n        <YkRangeDateWithVSSelect\n          options={options}\n          disabled={disableCompare}\n          onChange={(v) => {\n            switch (v.value) {\n              case 'customize':\n                setHasDate(true);\n                setDateOpen(true);\n                // setIsFocus(true);\n                break;\n              default: {\n                const arr = checkDate(Number(v.value));\n                onChange({ rangeDate: arr });\n                break;\n              }\n            }\n          }}\n        >\n          <Tooltip\n            placement='top'\n            title={\n              disableCompare\n                ? '日期对比不支持细分'\n                : picker === 'month'\n                  ? '实际数据为选择的日期所在月份的整月数据'\n                  : null\n            }\n            color='#fff'\n            styles={{\n              body: {\n                color: '#333',\n              },\n            }}\n          >\n            <div\n              className={classNames(styles.globalMl, styles.globalItem, disableCompare ? styles.globalDisabled : '')}\n            >\n              <i className={itemCheckIconClass('icon-jiahao2')} />\n              <div>日期对比</div>\n            </div>\n          </Tooltip>\n        </YkRangeDateWithVSSelect>\n      )}\n    </div>\n  );\n};\n\nexport default YkRangeDateWithVSCompare;\n"],
+  "mappings": "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",
   "names": ["classNames", "styles", "dayjs", "React", "datePickerZhCN", "YkRangeDateWithVSSelect"]
 }

package/dist/lib/components/YkRangeDateWithVS/YkRangeDateWithVSRange.d.ts

@@ -1,5 +1,5 @@
 import type { DatePickerProps } from 'antd';
-import { Dayjs } from 'dayjs';
+import { type Dayjs } from 'dayjs';
 import React, { type ReactNode } from 'react';
 type DateValue = Dayjs | null;
 type RangeValue = [DateValue, DateValue] | null;

package/dist/lib/components/YkRangeDateWithVS/YkRangeDateWithVSRange.js

@@ -221,6 +221,7 @@ var YkRangeDateWithVSRange = ({
 }) => {
   const { token } = import_antd.theme.useToken();
   const hasCustomRangeDisplay = rangeDisplayLabel != null;
+  const triggerWrapRef = (0, import_react.useRef)(null);
   const [groupOpen, setGroupOpen] = (0, import_react.useState)(false);
   const [isChange, setIsChange] = (0, import_react.useState)(false);
   const filterType = milestoneFilterType;
@@ -262,6 +263,25 @@ var YkRangeDateWithVSRange = ({
   (0, import_react.useEffect)(() => {
     initRangeDate();
   }, [rangeDate, timeType]);
+  (0, import_react.useEffect)(() => {
+    if (!groupOpen)
+      return;
+    const onPointerDownCapture = (e) => {
+      var _a;
+      const el = e.target;
+      if (!(el instanceof Element))
+        return;
+      if ((_a = triggerWrapRef.current) == null ? void 0 : _a.contains(el))
+        return;
+      if (el.closest("[data-yk-range-date-with-vs-panel]"))
+        return;
+      if (import_styles.default.globalItemDatePanel && el.closest(`.${import_styles.default.globalItemDatePanel}`))
+        return;
+      setGroupOpen(false);
+    };
+    window.addEventListener("pointerdown", onPointerDownCapture, true);
+    return () => window.removeEventListener("pointerdown", onPointerDownCapture, true);
+  }, [groupOpen]);
   const customFormat = (value) => {
     return `${(0, import_dayjs.default)(value).format("YYYY-MM-DD")}`;
   };
@@ -351,7 +371,7 @@ var YkRangeDateWithVSRange = ({
     );
   }));
   const dateGourpRender = (panelNode) => {
-    return /* @__PURE__ */ import_react.default.createElement("div", null, dateCompare && /* @__PURE__ */ import_react.default.createElement("div", { className: import_styles.default.ykRangeDateWithVsHeader }, /* @__PURE__ */ import_react.default.createElement(
+    return /* @__PURE__ */ import_react.default.createElement("div", { "data-yk-range-date-with-vs-panel": true }, dateCompare && /* @__PURE__ */ import_react.default.createElement("div", { className: import_styles.default.ykRangeDateWithVsHeader }, /* @__PURE__ */ import_react.default.createElement(
       import_antd.Anchor,
       {
         className: import_styles.default.ykRangeDateWithVsHeaderAnchor,
@@ -546,7 +566,7 @@ var YkRangeDateWithVSRange = ({
       }
     }
   );
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)(import_styles.default.globalMl, import_styles.default.globalItem) }, dateCompare && !!options.length && /* @__PURE__ */ import_react.default.createElement("label", { onClick: () => setGroupOpen(true), className: import_styles.default.globalItemDateTerm }, /* @__PURE__ */ import_react.default.createElement("span", { style: { marginRight: "5px", fontSize: 14 } }, timeType), /* @__PURE__ */ import_react.default.createElement("i", { style: { marginRight: "10px" }, className: (0, import_classnames.default)("iconfont icon-xiala1") })), /* @__PURE__ */ import_react.default.createElement("i", { className: itemCheckIconClass("icon-riqi1"), style: { fontSize: 14 } }), /* @__PURE__ */ import_react.default.createElement(
+  return /* @__PURE__ */ import_react.default.createElement("div", { ref: triggerWrapRef, className: (0, import_classnames.default)(import_styles.default.globalMl, import_styles.default.globalItem) }, dateCompare && !!options.length && /* @__PURE__ */ import_react.default.createElement("label", { onClick: () => setGroupOpen(true), className: import_styles.default.globalItemDateTerm }, /* @__PURE__ */ import_react.default.createElement("span", { style: { marginRight: "5px", fontSize: 14 } }, timeType), /* @__PURE__ */ import_react.default.createElement("i", { style: { marginRight: "10px" }, className: (0, import_classnames.default)("iconfont icon-xiala1") })), /* @__PURE__ */ import_react.default.createElement("i", { className: itemCheckIconClass("icon-riqi1"), style: { fontSize: 14 } }), /* @__PURE__ */ import_react.default.createElement(
     import_antd.ConfigProvider,
     {
       theme: {