Skip to content

localeParse missing A → a replacement causes date-fns crash with use12Hours #964

@daedalus28

Description

@daedalus28

Bug

When using the date-fns generateConfig with use12Hours, the picker crashes with:

RangeError: Format string contains an unescaped latin alphabet character `A`

This happens because use12Hours causes rc-picker to internally inject uppercase A (moment.js AM/PM token) into the format string. The localeParse function in src/generate/dateFns.ts converts other moment tokens to date-fns equivalents but doesn't handle Aa:

const localeParse = (format: string) =>
  format
    .replace(/Y/g, 'y')
    .replace(/D/g, 'd')
    .replace(/gggg/, 'yyyy')
    .replace(/g/g, 'G')
    .replace(/([Ww])o/g, 'wo');
    // missing: .replace(/A/g, 'a')

date-fns uses lowercase a for AM/PM (hh:mm:ss a), while moment.js uses uppercase A. Since localeParse already handles the other moment → date-fns conversions, this one was likely just missed.

Suggested fix

Add .replace(/A/g, 'a') to localeParse:

const localeParse = (format: string) =>
  format
    .replace(/Y/g, 'y')
    .replace(/D/g, 'd')
    .replace(/gggg/, 'yyyy')
    .replace(/g/g, 'G')
    .replace(/([Ww])o/g, 'wo')
    .replace(/A/g, 'a');

Reproduction

import dateFnsGenerateConfig from '@rc-component/picker/es/generate/dateFns'
import generatePicker from 'antd/es/date-picker/generatePicker'

const DatePicker = generatePicker<Date>(dateFnsGenerateConfig)

// This crashes:
<DatePicker showTime use12Hours />

Versions

  • @rc-component/picker: 1.9.1
  • date-fns: 4.1.0
  • antd: 6.3.5

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions