Docs: Add README for DatePicker and TimePicker Components

[shrivastavanolo]

What?

Closes #18072

Adds README files for the DatePicker and TimePicker components

Why?

As mentioned in #18072 (comment) both the DatePicker and TimePicker components require their own README files as they can be used not just as a part of the DateTimePicker ( which already has a README ) but also individually.

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

Unlinked Accounts

The following contributors have not linked their GitHub and WordPress.org accounts: @ShreyaShrivastava@192.168.1.12, @jpbelo, @ItsJonQ, @mkaz.

Contributors, please read how to link your accounts to ensure your work is properly credited in WordPress releases.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Unlinked contributors: shreyashrivastava@192.168.1.12, jpbelo, ItsJonQ, mkaz.

Co-authored-by: shrivastavanolo <shreya0shrivastava@git.wordpress.org>
Co-authored-by: ciampo <mciampini@git.wordpress.org>
Co-authored-by: gziolo <gziolo@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
Co-authored-by: stokesman <presstoke@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[shrivastavanolo]

Hi @jorgefilipecosta, do you mind taking a look at this when you get a chance?

I noticed you had previously reviewed #74612, which has since been closed, but the issue still seems to persist. Would appreciate your input here. Thank you!

[Copilot]

Pull request overview

Adds standalone documentation pages for the DatePicker and TimePicker components so they can be referenced independently (in addition to their inclusion in DateTimePicker docs).

Changes:

• Add new README docs for DatePicker and TimePicker.
• Register the new docs pages in docs/manifest.json.
• Note the documentation addition in packages/components/CHANGELOG.md.

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 6 comments.

File	Description
packages/components/src/date-time/time/README.md	New TimePicker documentation and props reference.
packages/components/src/date-time/date/README.md	New DatePicker documentation and props reference.
packages/components/CHANGELOG.md	Adds an Unreleased changelog entry for the new docs.
docs/manifest.json	Adds “Date” and “Time” docs entries under Components.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[ciampo]

Thanks for working on this! A few additional items I noticed beyond what Copilot flagged:

---

Formatting (alignment with existing READMEs)

1. List markers — use - instead of *
   The existing DateTimePicker README (and virtually all other component READMEs) use hyphens for metadata lines. Both new files use asterisks. For example:

   -* Required: No
   +- Required: No

2. Missing blank line before code fence (date/README.md)
   After "Render a DatePicker." there's no blank line before the opening code fence. Other READMEs always have one.

3. Orphaned "best practices" bullet (date/README.md)
   There's a stray * Use smart defaults and highlight the current date. after the component description, without a section heading. Either wrap it in a ## Best practices section (like the parent DateTimePicker README) or remove it.

4. Import source — both READMEs import useState from @wordpress/element, but the parent DateTimePicker README imports from 'react'. For consistency, these should match:

   -import { useState } from '@wordpress/element';
   +import { useState } from 'react';

5. Redundant Type: lines — several props include the type in the heading and a separate * Type: line (e.g. events, is12Hour, hideLabelFromVision). The parent README only puts the type in the heading. The extra line can be removed.

6. Extra blank line in TimePicker example — there's a blank line between const MyTimePicker = () => { and const [ time, setTime ]... that other examples don't have.

---

Accuracy

7. events type notation (date/README.md)
   The heading uses [{ date: Date }] (a tuple of exactly one element). It should be { date: Date }[] (an array), matching both the TypeScript types and the parent README.

---

Completeness

8. Missing TimePicker.TimeInput documentation — TimePicker exposes a compound sub-component (TimePicker.TimeInput) that isn't mentioned in the new README. Worth at least a brief section or a note pointing to it.

9. Manifest titles (docs/manifest.json)
   The new entries use "Date" and "Time" as titles, but the components are DatePicker and TimePicker. The sibling entry uses "DateTime" for DateTimePicker, so "DatePicker" and "TimePicker" would be more consistent and discoverable.

[shrivastavanolo]

Hey @ciampo, Thanks for the review!

Manifest titles (docs/manifest.json)
The new entries use "Date" and "Time" as titles, but the components are DatePicker and TimePicker. The sibling entry uses "DateTime" for DateTimePicker, so "DatePicker" and "TimePicker" would be more consistent and discoverable.

Regarding the manifest titles — it looks like these need to be auto-generated via npm run docs:build and are currently derived from the folder names (time and date). I did try updating them manually to TimePicker and DatePicker, but that caused the checks to fail, likely because they get overwritten during the docs build step.

Changing the folder names to match the component names could also potentially break existing imports, so that might not be a safe option.

Happy to adjust this if there’s a preferred way to override the generated titles, but it seems like this might need to be handled at the generation level instead.

[ciampo]

Left a few more comments.

Re. the manifest component titles, you're correct about them being automatically generated by the script. Maybe we can rename the folders:

• date/ => date-picker/
• time/ => time-picker/

And update packages/components/src/date-time/index.ts and packages/components/src/date-time/types.ts accordingly, which should implicitly fix the generated doc names

[shrivastavanolo]

Hi @ciampo, I’ve addressed the feedback (tabs, folder renames, and docs build). Could you please take another look when you get a chance? Thanks!

[ciampo]

I noticed that the README of the parent DateTimePicker has an error that we should fix in this PR too:

diff --git i/packages/components/src/date-time/README.md w/packages/components/src/date-time/README.md
index b57a3f859b0..5c69d8a2909 100644
--- i/packages/components/src/date-time/README.md
+++ w/packages/components/src/date-time/README.md
@@ -70,7 +70,7 @@ A callback function which receives a Date object representing a day as an argume
 
 -   Required: No
 
-### `onMonthPreviewed`: `( date: Date ) => void`
+### `onMonthPreviewed`: `( date: string ) => void`
 
 A callback invoked when selecting the previous/next month in the date picker. The callback receives the new month date in the ISO format as an argument.
 
@@ -87,5 +87,5 @@ List of events to show in the date picker. Each event will appear as a dot on th
 
 The day that the week should start on. 0 for Sunday, 1 for Monday, etc.
 
-- Required: No
-- Default: 0
+-   Required: No
+-   Default: 0

[shrivastavanolo]

Hi @ciampo, I’ve addressed the latest feedback . Could you please take another look? Thanks!

[ciampo]

LGTM 🚀

Thank you!