Skip to content

feat: allow function for dateFormat prop#6281

Draft
pataar wants to merge 4 commits intoHacker0x01:mainfrom
pataar:feat/function-date-format
Draft

feat: allow function for dateFormat prop#6281
pataar wants to merge 4 commits intoHacker0x01:mainfrom
pataar:feat/function-date-format

Conversation

@pataar
Copy link
Copy Markdown

@pataar pataar commented Apr 10, 2026

Summary

  • Extends the dateFormat prop to accept (date: Date) => string in addition to string | string[], enabling Intl.DateTimeFormat or any custom formatting logic
  • Adds DateFormat type alias exported from the package for consumer use
  • formatMultipleDates, safeDateRangeFormat, and safeMultipleDatesFormat are all compatible with function-based formats
  • When dateFormat is a function, parsing typed input is gracefully skipped (no format string to parse against)
  • Includes docs-site example demonstrating Intl.DateTimeFormat usage

Example usage

<DatePicker
  dateFormat={(date) =>
    new Intl.DateTimeFormat("en-US", {
      weekday: "short",
      year: "numeric",
      month: "long",
      day: "numeric",
    }).format(date)
  }
  selected={selectedDate}
  onChange={setSelectedDate}
/>

Test plan

  • Unit tests for safeDateFormat, safeDateRangeFormat, safeMultipleDatesFormat with function dateFormat
  • Integration tests for single date, range, partial range, and multiple dates with function dateFormat
  • Integration test for formatMultipleDates callback with function dateFormat
  • Full test suite passes (1499 tests)
  • TypeScript type-check passes
  • ESLint + Stylelint pass

pataar added 4 commits April 10, 2026 21:25
Extends the `dateFormat` prop to accept `(date: Date) => string` in addition
to the existing `string | string[]`. This enables users to use
`Intl.DateTimeFormat` or any custom formatting logic for the input display.

When `dateFormat` is a function, locale and timeZone are delegated to the
function itself. Parsing typed input is skipped since there is no format
string to parse against.

The `formatMultipleDates` callback is fully compatible — its `formatDate`
helper automatically uses the function-based format when provided.
Inherits the user's system locale instead of hardcoding en-US.
@pataar pataar marked this pull request as draft April 11, 2026 06:59
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant