Date range field error on required field

[ajnsn]

Bug description

When creating a new entry in a collection with a required date field in range mode, the Control Panel throws a JavaScript error on page load and the date field doesn't initialize properly.

index-DViLjBmV.js:17 TypeError: Cannot read properties of null (reading 'start')
    at setup (index-DViLjBmV.js:134:111270)
    at callWithErrorHandling (index-DViLjBmV.js:17:2117)
    at setupStatefulComponent (index-DViLjBmV.js:18:60686)
    at setupComponent (index-DViLjBmV.js:18:60346)
    at zt (index-DViLjBmV.js:18:32910)
    at qt (index-DViLjBmV.js:18:32746)
    at ze (index-DViLjBmV.js:18:28575)
    at ReactiveEffect.Sn [as fn] (index-DViLjBmV.js:18:34471)
    at ReactiveEffect.run (index-DViLjBmV.js:10:2343)
    at It (index-DViLjBmV.js:18:35003)

Also, was seems odd is that the Field saves the dates e.g. 2026-02-05 as "2026-02-04 23:00" and displays them as 2026-02-05. In v5 the Range mode only saved the exact selected date (e.g. 2026-02-05).

How to reproduce

1. Fresh install of Statamic v6 via statamic new statamic-6
2. Create a collection with a date field in range mode
3. Set the date field as required: true in the blueprint
4. Navigate to create a new entry in the collection
5. Console error appears and date field doesn't initialize

Workaround: Removing the required setting fixes the error.

Configuration:

• config/app.php: 'timezone' => 'UTC'
• config/statamic/system.php: 'display_timezone' => null and 'localize_dates_in_modifiers' => false (default values)

Collection

title: Events
revisions: false
date_behavior:
  past: public
  future: private

Blueprint

title: Event
tabs:
  main:
    display: Main
    sections:
      -
        fields:
          -
            handle: title
            field:
              type: text
              required: true
              validate:
                - required
          -
            handle: content
            field:
              type: markdown
              display: Content
              localizable: true
          -
            handle: author
            field:
              type: users
              display: Author
              default: current
              localizable: true
              max_items: 1
          -
            handle: template
            field:
              type: template
              display: Template
              localizable: true
  sidebar:
    display: Sidebar
    sections:
      -
        fields:
          -
            handle: slug
            field:
              type: slug
              localizable: true
              validate: 'max:200'
          -
            handle: date_field
            field:
              mode: range
              type: date
              display: 'Date Field'
              required: true  # This causes the error

Logs

Environment

• Statamic Version: 6.2.3 (fresh install)
• PHP Version: 8.4.17
• Laravel Version: 12.50.0
• Browser: Chrome 144.0.7559.133 (arm64)

Installation

Fresh statamic/statamic site via CLI

Additional details

No response

[duncanmcclean]

That's odd... I can't reproduce the error you're seeing on page load:

However, I do see a different error when I try and select a date. I believe it should be fixed by #13512.

Also, was seems odd is that the Field saves the dates e.g. 2026-02-05 as "2026-02-04 23:00" and displays them as 2026-02-05. In v5 the Range mode only saved the exact selected date (e.g. 2026-02-05).

Statamic now stores dates in UTC, meaning we need to save the time as well to ensure dates are converted to your local timezone correctly.

[marijoo]

Can confirm that and was having the same issue. Thank you @ajnsn for pointing out the workaround which was also working for me: Removing the required rule fixes the problem, which is indeed strange.

Only difference here is I have Europe/Berlin set as my app’s timezone.