Specifying `(zzz)` in the date format prevents typing an input

Author: hach-queCreated Jul 6, 2026Updated Jul 7, 2026

Describe the bug If you set a date picker with a dateFormat that includes zzz for timezone, it prevents typing a date in.

To Reproduce

Create a date picker control, and set the dateFormat accordingly:

<DatePicker
  className="form-control"
  selected={props.eventEnds}
  onChange={onEventEndsChange}
  disabled={props.disabled}
  showPopperArrow={false}
  portalId="date-time-portal"
  showTimeSelect
  timeFormat="h:mm aa"
  dateFormat="MMMM d, yyyy h:mm aa (zzz)"
/>

Then, try typing an input into the date picker and observe the errors in the console:

Uncaught RangeError: Format string contains an unescaped latin alphabet character `z`
    parse parse.js:445
    parseDate index.es.js:239
    handleChange index.es.js:4850
    React 8
    sentryWrapped helpers.js:40
    _wrapEventTarget browserapierrors.js:124
    instrumentDOM dom.js:42
    React 5
    main entry.browser.tsx:369
    startTransition React
    main entry.browser.tsx:368
    async* entry.browser.tsx:377

When this errors happens, the user's input is discarded when they unfocus the control.

Expected behavior Using the timezone in the date format should not prevent users from typing in a date and time that matches the format.

Desktop:

OS: Windows
Browser: Firefox
Version: 152.0.4

Source: Hacker0x01/react-datepicker

View original on GitHub View discussion on GitHub