feat: add pickerUtc option to datetime widget (#3721)

I have a field that I would like to contain just a date (with no specific
time). When I configure the datetime widget with sensible options for
a date-only field, dates are stored properly in the saved markdown,
but when I load those dates in the UI, I see the date before.

This is happening because the DateTime component from the
react-datetime library uses local timezones. It loads the date as the
start of day UTC and then converts to the local timezone, which is
going to be the previous day in any timezone with a negative UTC offset,
including all of the Americas.

This change adds a pickerUtc option to the datetime widget so that users
can specify when they would like the datetime picker to display times in
UTC rather than in the local timezone. By setting this new option to
true on date-only fields, users can ensure that everyone sees the same
date in the picker regardless of local timezones.

packages/netlify-cms-widget-datetime/src/DateTimeControl.js

@@ -44,8 +44,15 @@ export default class DateTimeControl extends React.Component {
     return defaultValue;
   }
 
+  getPickerUtc() {
+    const { field } = this.props;
+    const pickerUtc = field.get('pickerUtc');
+    return pickerUtc;
+  }
+
   formats = this.getFormats();
   defaultValue = this.getDefaultValue();
+  pickerUtc = this.getPickerUtc();
 
   componentDidMount() {
     const { value } = this.props;
@@ -125,6 +132,7 @@ export default class DateTimeControl extends React.Component {
           onFocus={setActiveStyle}
           onBlur={this.onBlur}
           inputProps={{ className: classNameWrapper, id: forID }}
+          utc={this.pickerUtc}
         />
         <div
           css={css`

website/content/docs/widgets/datetime.md

@@ -13,6 +13,7 @@ The datetime widget translates a datetime picker to a datetime string.
   - `format`: sets storage format; accepts Moment.js [tokens](https://momentjs.com/docs/#/parsing/string-format/); defaults to raw Date object (if supported by output format)
   - `dateFormat`: sets date display format in UI; boolean or Moment.js [tokens](https://momentjs.com/docs/#/parsing/string-format/). If `true` use default locale format.
   - `timeFormat`: sets time display format in UI; boolean or Moment.js [tokens](https://momentjs.com/docs/#/parsing/string-format/). If `true` use default locale format, `false` hides time-picker.
+  - `pickerUtc`: _(default: `false`)_ when set to `true`, the datetime picker will display times in UTC. When `false`, the datetime picker will display times in the user's local timezone. When using date-only formats, it can be helpful to set this to `true` so users in all timezones will see the same date in the datetime picker.
 - **Example:**
     ```yaml
     - label: "Start time"
@@ -22,4 +23,5 @@ The datetime widget translates a datetime picker to a datetime string.
       dateFormat: "DD.MM.YYYY" # e.g. 24.12.2021
       timeFormat: "HH:mm" # e.g. 21:07
       format: "LLL"
+      pickerUtc: false
     ```