Keep post publishing popover open when a date is clicked (#29738)

* Keep focus on the post schedule popover
Add a keepOpen prop to the DateTimePicker and keep focus on the date
picker popover when true.

* Document keepOpen prop

packages/components/src/date-time/README.md

@@ -84,3 +84,10 @@ This function will be called on each day, every time user browses into a differe
 
 - Type: `Function`
 - Required: No
+
+### keepOpen
+
+Whether focus should stay on the `DateTimePicker` after clicking on a date in the calendar.
+
+- Type: `bool`
+- Required: No

packages/components/src/date-time/date.js

@@ -59,7 +59,7 @@ class DatePicker extends Component {
 	}
 
 	onChangeMoment( newDate ) {
-		const { currentDate, onChange } = this.props;
+		const { currentDate, onChange, keepOpen } = this.props;
 
 		// If currentDate is null, use now as momentTime to designate hours, minutes, seconds.
 		const momentDate = currentDate ? moment( currentDate ) : moment();
@@ -70,6 +70,11 @@ class DatePicker extends Component {
 		};
 
 		onChange( newDate.set( momentTime ).format( TIMEZONELESS_FORMAT ) );
+
+		// Keep focus on the date picker popover.
+		if ( keepOpen ) {
+			this.keepFocusInside();
+		}
 	}
 
 	/**

packages/components/src/date-time/index.js

@@ -28,6 +28,7 @@ function DateTimePicker(
 		onMonthPreviewed,
 		onChange,
 		events,
+		keepOpen,
 	},
 	ref
 ) {
@@ -54,6 +55,7 @@ function DateTimePicker(
 						isInvalidDate={ isInvalidDate }
 						onMonthPreviewed={ onMonthPreviewed }
 						events={ events }
+						keepOpen={ keepOpen }
 					/>
 				</>
 			) }

packages/editor/src/components/post-schedule/index.js

@@ -33,6 +33,7 @@ export function PostSchedule( { date, onUpdateDate } ) {
 			currentDate={ date }
 			onChange={ onChange }
 			is12Hour={ is12HourTime }
+			keepOpen={ true }
 		/>
 	);
 }