@instructure/ui-date-time-input 8.56.0 → 8.56.2-pr-snapshot-1721749364069

package/CHANGELOG.md

@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.56.2-pr-snapshot-1721749364069](https://github.com/instructure/instructure-ui/compare/v8.56.1...v8.56.2-pr-snapshot-1721749364069) (2024-07-23)
+
+**Note:** Version bump only for package @instructure/ui-date-time-input
+
+
+
+
+
+## [8.56.1](https://github.com/instructure/instructure-ui/compare/v8.56.0...v8.56.1) (2024-06-13)
+
+**Note:** Version bump only for package @instructure/ui-date-time-input
+
+
+
+
+
 # [8.56.0](https://github.com/instructure/instructure-ui/compare/v8.55.1...v8.56.0) (2024-05-06)
 
 **Note:** Version bump only for package @instructure/ui-date-time-input

package/lib/DateTimeInput/__new-tests__/DateTimeInput.test.js

@@ -6,8 +6,7 @@ var _react2 = require("@testing-library/react");
 var _userEvent = _interopRequireDefault(require("@testing-library/user-event"));
 require("@testing-library/jest-dom");
 var _index = require("../index");
-var _ApplyLocale = require("@instructure/ui-i18n/lib/ApplyLocale");
-var _DateTime = require("@instructure/ui-i18n/lib/DateTime.js");
+var _uiI18n = require("@instructure/ui-i18n");
 var _DateTimeInput, _DateTimeInput2, _DateTimeInput3;
 /*
  * The MIT License (MIT)
@@ -44,7 +43,7 @@ describe('<DateTimeInput />', () => {
   it('should use the default value', () => {
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, {
       description: "date_time",
       prevMonthLabel: "Previous month",
@@ -65,7 +64,7 @@ describe('<DateTimeInput />', () => {
     const onChange = jest.fn();
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T23:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T23:30Z', locale, timezone);
     (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, {
       description: "date_time",
       prevMonthLabel: "Previous month",
@@ -86,8 +85,8 @@ describe('<DateTimeInput />', () => {
   it('should prefer value to defaultValue', () => {
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const value = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
-    const defaultValue = _DateTime.DateTime.parse('2016-04-01T17:00Z', locale, timezone);
+    const value = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const defaultValue = _uiI18n.DateTime.parse('2016-04-01T17:00Z', locale, timezone);
     const onChange = jest.fn();
     (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, {
       description: "date_time",
@@ -110,7 +109,7 @@ describe('<DateTimeInput />', () => {
   it('should set time to local midnight when only date is set', () => {
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateObj = _DateTime.DateTime.parse('2017-04-01T18:30Z', locale, timezone);
+    const dateObj = _uiI18n.DateTime.parse('2017-04-01T18:30Z', locale, timezone);
     const date = dateObj.toISOString().split('T')[0];
     (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, {
       description: "date_time",
@@ -174,7 +173,7 @@ describe('<DateTimeInput />', () => {
     const onChange = jest.fn();
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const defaultValue = _DateTime.DateTime.parse('2017-05-01T17:00', locale, timezone);
+    const defaultValue = _uiI18n.DateTime.parse('2017-05-01T17:00', locale, timezone);
     (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, {
       description: "date_time",
       dateRenderLabel: "date-input",
@@ -232,7 +231,7 @@ describe('<DateTimeInput />', () => {
   it('should show the formatted date-time message', () => {
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const defaultValue = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const defaultValue = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const _render3 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, {
         description: "date_time",
         dateRenderLabel: "date-input",
@@ -250,7 +249,7 @@ describe('<DateTimeInput />', () => {
   it('should show the formatted date-time message in the proper locale', () => {
     const timezone = 'US/Eastern';
     const locale = 'fr';
-    const defaultValue = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const defaultValue = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const _render4 = (0, _react2.render)( /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, {
         description: "date_time",
         dateRenderLabel: "date-input",
@@ -293,7 +292,7 @@ describe('<DateTimeInput />', () => {
     const onChange = jest.fn();
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const props = {
       description: 'date_time',
       prevMonthLabel: 'Previous month',
@@ -319,7 +318,7 @@ describe('<DateTimeInput />', () => {
     const onChange = jest.fn();
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const props = {
       description: 'date_time',
       dateRenderLabel: 'date-input',
@@ -345,7 +344,7 @@ describe('<DateTimeInput />', () => {
     const onChange = jest.fn();
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const props = {
       description: 'date_time',
       dateRenderLabel: 'date-input',
@@ -404,7 +403,7 @@ describe('<DateTimeInput />', () => {
   it('should update error message when value is invalid', async () => {
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const props = {
       description: 'date_time',
       dateRenderLabel: 'date-input',
@@ -432,7 +431,7 @@ describe('<DateTimeInput />', () => {
   it('should show supplied message', async () => {
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const props = {
       description: 'date_time',
       dateRenderLabel: 'date-input',
@@ -464,7 +463,7 @@ describe('<DateTimeInput />', () => {
   it('should not show built in message when `showMessages` is false', async () => {
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const props = {
       description: 'date_time',
       dateRenderLabel: 'date-input',
@@ -510,11 +509,11 @@ describe('<DateTimeInput />', () => {
   });
   it('should read locale and timezone from context', () => {
     const onChange = jest.fn();
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', 'en-US', 'GMT');
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', 'en-US', 'GMT');
     const _render13 = (0, _react2.render)(
       /*#__PURE__*/
       // Africa/Nairobi is GMT +3
-      _react.default.createElement(_ApplyLocale.ApplyLocale, {
+      _react.default.createElement(_uiI18n.ApplyLocale, {
         locale: "fr",
         timezone: "Africa/Nairobi"
       }, /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, {
@@ -532,7 +531,7 @@ describe('<DateTimeInput />', () => {
   });
   it('should format date according to dateFormat', async () => {
     const onChange = jest.fn();
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', 'en-US', 'GMT');
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', 'en-US', 'GMT');
     const props = {
       description: 'date_time',
       dateRenderLabel: 'date-input',
@@ -559,7 +558,7 @@ describe('<DateTimeInput />', () => {
   });
   it('should format bottom message according to messageFormat', async () => {
     const onChange = jest.fn();
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', 'en-US', 'GMT');
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', 'en-US', 'GMT');
     const props = {
       description: 'date_time',
       dateRenderLabel: 'date-input',
@@ -587,7 +586,7 @@ describe('<DateTimeInput />', () => {
   it('should update Date and Time inputs when value prop changes', async () => {
     const locale = 'en-US';
     const timezone = 'US/Eastern';
-    const dateTime = _DateTime.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
+    const dateTime = _uiI18n.DateTime.parse('2017-05-01T17:30Z', locale, timezone);
     const props = {
       description: 'date_time',
       dateRenderLabel: 'date-input',
@@ -604,7 +603,7 @@ describe('<DateTimeInput />', () => {
       rerender = _render16.rerender;
     expect(container).toHaveTextContent('May 1, 2017 1:30 PM');
     const newDateStr = '2022-03-29T19:00Z';
-    const newDateTime = _DateTime.DateTime.parse(newDateStr, locale, timezone);
+    const newDateTime = _uiI18n.DateTime.parse(newDateStr, locale, timezone);
     rerender( /*#__PURE__*/_react.default.createElement(_index.DateTimeInput, Object.assign({}, props, {
       value: newDateStr
     })));

package/lib/DateTimeInput/index.js

@@ -6,18 +6,15 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = exports.DateTimeInput = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _Locale = require("@instructure/ui-i18n/lib/Locale.js");
-var _DateTime = require("@instructure/ui-i18n/lib/DateTime.js");
-var _ApplyLocaleContext = require("@instructure/ui-i18n/lib/ApplyLocale/ApplyLocaleContext.js");
-var _FormFieldGroup = require("@instructure/ui-form-field/lib/FormFieldGroup");
-var _DateInput = require("@instructure/ui-date-input/lib/DateInput");
-var _TimeSelect = require("@instructure/ui-time-select/lib/TimeSelect");
-var _Calendar = require("@instructure/ui-calendar/lib/Calendar");
-var _testable = require("@instructure/ui-testable/lib/testable.js");
-var _AccessibleContent = require("@instructure/ui-a11y-content/lib/AccessibleContent");
-var _IconButton = require("@instructure/ui-buttons/lib/IconButton");
-var _IconArrowOpenEndSolid = require("@instructure/ui-icons/lib/IconArrowOpenEndSolid.js");
-var _IconArrowOpenStartSolid = require("@instructure/ui-icons/lib/IconArrowOpenStartSolid.js");
+var _uiI18n = require("@instructure/ui-i18n");
+var _uiFormField = require("@instructure/ui-form-field");
+var _uiDateInput = require("@instructure/ui-date-input");
+var _uiTimeSelect = require("@instructure/ui-time-select");
+var _uiCalendar = require("@instructure/ui-calendar");
+var _uiTestable = require("@instructure/ui-testable");
+var _uiA11yContent = require("@instructure/ui-a11y-content");
+var _uiButtons = require("@instructure/ui-buttons");
+var _uiIcons = require("@instructure/ui-icons");
 var _props = require("./props");
 var _console = require("@instructure/console");
 var _dec, _class, _class2, _IconArrowOpenStartSo, _IconArrowOpenEndSoli;
@@ -49,7 +46,7 @@ var _dec, _class, _class2, _IconArrowOpenStartSo, _IconArrowOpenEndSoli;
 category: components
 ---
 **/
-let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 = class DateTimeInput extends _react.Component {
+let DateTimeInput = exports.DateTimeInput = (_dec = (0, _uiTestable.testable)(), _dec(_class = (_class2 = class DateTimeInput extends _react.Component {
   constructor(props) {
     super(props);
     // State needs to be calculated because render could be called before
@@ -67,14 +64,14 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
         dateInputText: date.value,
         dateInputTextChanged: true,
         calendarSelectedDate: dateParsed ? dateParsed : void 0,
-        renderedDate: dateParsed ? dateParsed.clone() : _DateTime.DateTime.now(this.locale(), this.timezone())
+        renderedDate: dateParsed ? dateParsed.clone() : _uiI18n.DateTime.now(this.locale(), this.timezone())
       });
     };
     // date is returned es a ISO string, like 2021-09-14T22:00:00.000Z
     this.handleDayClick = (event, {
       date
     }) => {
-      const dateParsed = _DateTime.DateTime.parse(date, this.locale(), this.timezone());
+      const dateParsed = _uiI18n.DateTime.parse(date, this.locale(), this.timezone());
       this.updateStateBasedOnDateInput(dateParsed, event);
     };
     this.handleHideCalendar = event => {
@@ -154,7 +151,7 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
       } else if (this.state.iso) {
         toAlter = this.state.iso.clone();
       } else {
-        toAlter = _DateTime.DateTime.now(this.locale(), this.timezone());
+        toAlter = _uiI18n.DateTime.now(this.locale(), this.timezone());
       }
       toAlter.add({
         days: 1
@@ -171,7 +168,7 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
       } else if (this.state.iso) {
         toAlter = this.state.iso.clone();
       } else {
-        toAlter = _DateTime.DateTime.now(this.locale(), this.timezone());
+        toAlter = _uiI18n.DateTime.now(this.locale(), this.timezone());
       }
       toAlter.subtract({
         days: 1
@@ -219,12 +216,12 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
   recalculateState(dateStr, doNotChangeDate = false, doNotChangeTime = false) {
     let errorMsg;
     if (dateStr) {
-      const parsed = _DateTime.DateTime.parse(dateStr, this.locale(), this.timezone());
+      const parsed = _uiI18n.DateTime.parse(dateStr, this.locale(), this.timezone());
       if (parsed.isValid()) {
         var _this$state;
         if (doNotChangeTime && this.state.timeSelectValue) {
           // There is a selected time, adjust the parsed date to its value
-          const timeParsed = _DateTime.DateTime.parse(this.state.timeSelectValue, this.locale(), this.timezone());
+          const timeParsed = _uiI18n.DateTime.parse(this.state.timeSelectValue, this.locale(), this.timezone());
           parsed.hour(timeParsed.hour()).minute(timeParsed.minute());
         }
         if (doNotChangeDate && this.state.iso) {
@@ -284,7 +281,7 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
       iso: void 0,
       calendarSelectedDate: void 0,
       dateInputText: dateStr ? dateStr : '',
-      renderedDate: _DateTime.DateTime.now(this.locale(), this.timezone()),
+      renderedDate: _uiI18n.DateTime.now(this.locale(), this.timezone()),
       dateInputTextChanged: false,
       ...clearTimeSelect
     };
@@ -295,7 +292,7 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
     } else if (this.context && this.context.locale) {
       return this.context.locale;
     }
-    return _Locale.Locale.browserLocale();
+    return _uiI18n.Locale.browserLocale();
   }
   timezone() {
     if (this.props.timezone) {
@@ -303,7 +300,7 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
     } else if (this.context && this.context.timezone) {
       return this.context.timezone;
     }
-    return _DateTime.DateTime.browserTimeZone();
+    return _uiI18n.DateTime.browserTimeZone();
   }
   get dateFormat() {
     return this.props.dateFormat;
@@ -324,14 +321,14 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
     return disabledDates(date.toISOString());
   }
   tryParseDate(val) {
-    const parsed = _DateTime.DateTime.parse(val, this.locale(), this.timezone());
+    const parsed = _uiI18n.DateTime.parse(val, this.locale(), this.timezone());
     return parsed.isValid() ? parsed : null;
   }
   updateStateBasedOnDateInput(dateParsed, event) {
     let newState;
     if (dateParsed && this.state.timeSelectValue && (!this.state.dateInputText || this.state.dateInputText == '')) {
       // There is already a selected time, but no date. Adjust the time too
-      const timeParsed = _DateTime.DateTime.parse(this.state.timeSelectValue, this.locale(), this.timezone());
+      const timeParsed = _uiI18n.DateTime.parse(this.state.timeSelectValue, this.locale(), this.timezone());
       const dateParsedAdjusted = dateParsed.set({
         hour: timeParsed.hour(),
         minute: timeParsed.minute()
@@ -350,9 +347,9 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
     // Sets it to the first local day of the week counting back from the start of the month.
     // Note that first day depends on the locale, e.g. it's Sunday in the US and
     // Monday in most of the EU.
-    const currDate = _DateTime.DateTime.getFirstDayOfWeek(renderedDate.startOf('month'));
+    const currDate = _uiI18n.DateTime.getFirstDayOfWeek(renderedDate.startOf('month'));
     const arr = [];
-    for (let i = 0; i < _Calendar.Calendar.DAY_COUNT; i++) {
+    for (let i = 0; i < _uiCalendar.Calendar.DAY_COUNT; i++) {
       arr.push(currDate.clone());
       currDate.add({
         days: 1
@@ -360,11 +357,11 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
     }
     return arr.map(date => {
       const dateStr = date.toISOString();
-      return /*#__PURE__*/_react.default.createElement(_DateInput.DateInput.Day, {
+      return /*#__PURE__*/_react.default.createElement(_uiDateInput.DateInput.Day, {
         key: dateStr,
         date: dateStr,
         isSelected: this.state.calendarSelectedDate ? date.isSame(this.state.calendarSelectedDate, 'day') : false,
-        isToday: date.isSame(_DateTime.DateTime.now(this.locale(), this.timezone()), 'day'),
+        isToday: date.isSame(_uiI18n.DateTime.now(this.locale(), this.timezone()), 'day'),
         isOutsideMonth: !date.isSame(renderedDate, 'month'),
         label: date.format('D MMMM YYYY') // used by screen readers
         ,
@@ -380,27 +377,27 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
       // this is an expensive function, only execute if the calendar is open
       return [];
     }
-    const shortDayNames = _DateTime.DateTime.getLocalDayNamesOfTheWeek(this.locale(), 'short');
-    const longDayNames = _DateTime.DateTime.getLocalDayNamesOfTheWeek(this.locale(), 'long');
-    return [/*#__PURE__*/_react.default.createElement(_AccessibleContent.AccessibleContent, {
+    const shortDayNames = _uiI18n.DateTime.getLocalDayNamesOfTheWeek(this.locale(), 'short');
+    const longDayNames = _uiI18n.DateTime.getLocalDayNamesOfTheWeek(this.locale(), 'long');
+    return [/*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
       key: 1,
       alt: longDayNames[0]
-    }, shortDayNames[0]), /*#__PURE__*/_react.default.createElement(_AccessibleContent.AccessibleContent, {
+    }, shortDayNames[0]), /*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
       key: 2,
       alt: longDayNames[1]
-    }, shortDayNames[1]), /*#__PURE__*/_react.default.createElement(_AccessibleContent.AccessibleContent, {
+    }, shortDayNames[1]), /*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
       key: 3,
       alt: longDayNames[2]
-    }, shortDayNames[2]), /*#__PURE__*/_react.default.createElement(_AccessibleContent.AccessibleContent, {
+    }, shortDayNames[2]), /*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
       key: 4,
       alt: longDayNames[3]
-    }, shortDayNames[3]), /*#__PURE__*/_react.default.createElement(_AccessibleContent.AccessibleContent, {
+    }, shortDayNames[3]), /*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
       key: 5,
       alt: longDayNames[4]
-    }, shortDayNames[4]), /*#__PURE__*/_react.default.createElement(_AccessibleContent.AccessibleContent, {
+    }, shortDayNames[4]), /*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
       key: 6,
       alt: longDayNames[5]
-    }, shortDayNames[5]), /*#__PURE__*/_react.default.createElement(_AccessibleContent.AccessibleContent, {
+    }, shortDayNames[5]), /*#__PURE__*/_react.default.createElement(_uiA11yContent.AccessibleContent, {
       key: 7,
       alt: longDayNames[6]
     }, shortDayNames[6])];
@@ -409,13 +406,13 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
     if (!this.state.isShowingCalendar) {
       return;
     }
-    return /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
+    return /*#__PURE__*/_react.default.createElement(_uiButtons.IconButton, {
       size: "small",
       withBackground: false,
       withBorder: false,
-      renderIcon: type === 'prev' ? _IconArrowOpenStartSo || (_IconArrowOpenStartSo = /*#__PURE__*/_react.default.createElement(_IconArrowOpenStartSolid.IconArrowOpenStartSolid, {
+      renderIcon: type === 'prev' ? _IconArrowOpenStartSo || (_IconArrowOpenStartSo = /*#__PURE__*/_react.default.createElement(_uiIcons.IconArrowOpenStartSolid, {
         color: "primary"
-      })) : _IconArrowOpenEndSoli || (_IconArrowOpenEndSoli = /*#__PURE__*/_react.default.createElement(_IconArrowOpenEndSolid.IconArrowOpenEndSolid, {
+      })) : _IconArrowOpenEndSoli || (_IconArrowOpenEndSoli = /*#__PURE__*/_react.default.createElement(_uiIcons.IconArrowOpenEndSolid, {
         color: "primary"
       })),
       screenReaderLabel: type === 'prev' ? this.props.prevMonthLabel : this.props.nextMonthLabel
@@ -443,7 +440,7 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
       interaction = _this$props4.interaction,
       renderWeekdayLabels = _this$props4.renderWeekdayLabels,
       allowNonStepInput = _this$props4.allowNonStepInput;
-    return /*#__PURE__*/_react.default.createElement(_FormFieldGroup.FormFieldGroup, {
+    return /*#__PURE__*/_react.default.createElement(_uiFormField.FormFieldGroup, {
       description: description,
       layout: layout,
       rowSpacing: rowSpacing,
@@ -451,7 +448,7 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
       vAlign: "top",
       elementRef: this.handleRef,
       messages: [...(showMessages && this.state.message ? [this.state.message] : []), ...(messages || [])]
-    }, /*#__PURE__*/_react.default.createElement(_DateInput.DateInput, {
+    }, /*#__PURE__*/_react.default.createElement(_uiDateInput.DateInput, {
       display: "block",
       value: this.state.dateInputText,
       onChange: this.handleDateTextChange,
@@ -472,7 +469,7 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
       isRequired: isRequired,
       interaction: interaction,
       renderNavigationLabel: /*#__PURE__*/_react.default.createElement("span", null, /*#__PURE__*/_react.default.createElement("div", null, this.state.renderedDate.format('MMMM')), /*#__PURE__*/_react.default.createElement("div", null, this.state.renderedDate.format('y')))
-    }, this.renderDays()), /*#__PURE__*/_react.default.createElement(_TimeSelect.TimeSelect, {
+    }, this.renderDays()), /*#__PURE__*/_react.default.createElement(_uiTimeSelect.TimeSelect, {
       value: this.state.timeSelectValue,
       onChange: this.updateStateBasedOnTimeSelect,
       placeholder: timePlaceholder,
@@ -498,5 +495,5 @@ let DateTimeInput = exports.DateTimeInput = (_dec = (0, _testable.testable)(), _
   dateFormat: 'LL',
   // Localized date with full month, e.g. "August 6, 2014"
   allowNonStepInput: false
-}, _class2.contextType = _ApplyLocaleContext.ApplyLocaleContext, _class2)) || _class);
+}, _class2.contextType = _uiI18n.ApplyLocaleContext, _class2)) || _class);
 var _default = exports.default = DateTimeInput;

package/lib/DateTimeInput/props.js

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.propTypes = exports.allowedProps = void 0;
-var _FormPropTypes = require("@instructure/ui-form-field/lib/FormPropTypes.js");
-var _I18nPropTypes = require("@instructure/ui-i18n/lib/I18nPropTypes.js");
+var _uiFormField = require("@instructure/ui-form-field");
+var _uiI18n = require("@instructure/ui-i18n");
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _controllable = require("@instructure/ui-prop-types/lib/controllable.js");
+var _uiPropTypes = require("@instructure/ui-prop-types");
 /*
  * The MIT License (MIT)
  *
@@ -58,13 +58,13 @@ const propTypes = exports.propTypes = {
   timezone: _propTypes.default.string,
   invalidDateTimeMessage: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func]).isRequired,
   showMessages: _propTypes.default.bool,
-  messages: _propTypes.default.arrayOf(_FormPropTypes.FormPropTypes.message),
+  messages: _propTypes.default.arrayOf(_uiFormField.FormPropTypes.message),
   messageFormat: _propTypes.default.string,
   layout: _propTypes.default.oneOf(['stacked', 'columns', 'inline']),
   rowSpacing: _propTypes.default.oneOf(['none', 'small', 'medium', 'large']),
   colSpacing: _propTypes.default.oneOf(['none', 'small', 'medium', 'large']),
-  value: (0, _controllable.controllable)(_I18nPropTypes.I18nPropTypes.iso8601, 'onChange'),
-  defaultValue: _I18nPropTypes.I18nPropTypes.iso8601,
+  value: (0, _uiPropTypes.controllable)(_uiI18n.I18nPropTypes.iso8601, 'onChange'),
+  defaultValue: _uiI18n.I18nPropTypes.iso8601,
   renderWeekdayLabels: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.node])),
   isRequired: _propTypes.default.bool,
   onChange: _propTypes.default.func,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-date-time-input",
-  "version": "8.56.0",
+  "version": "8.56.2-pr-snapshot-1721749364069",
   "description": "A UI component that allows to select date and time.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,29 +23,29 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.56.0",
-    "@instructure/ui-test-utils": "8.56.0",
+    "@instructure/ui-babel-preset": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-test-utils": "8.56.2-pr-snapshot-1721749364069",
     "@testing-library/jest-dom": "^6.1.4",
     "@testing-library/react": "^14.1.2",
     "@testing-library/user-event": "^14.5.1"
   },
   "dependencies": {
     "@babel/runtime": "^7.23.2",
-    "@instructure/console": "8.56.0",
-    "@instructure/debounce": "8.56.0",
-    "@instructure/emotion": "8.56.0",
-    "@instructure/ui-a11y-content": "8.56.0",
-    "@instructure/ui-buttons": "8.56.0",
-    "@instructure/ui-calendar": "8.56.0",
-    "@instructure/ui-date-input": "8.56.0",
-    "@instructure/ui-form-field": "8.56.0",
-    "@instructure/ui-i18n": "8.56.0",
-    "@instructure/ui-icons": "8.56.0",
-    "@instructure/ui-prop-types": "8.56.0",
-    "@instructure/ui-react-utils": "8.56.0",
-    "@instructure/ui-testable": "8.56.0",
-    "@instructure/ui-time-select": "8.56.0",
-    "@instructure/ui-utils": "8.56.0",
+    "@instructure/console": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/debounce": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/emotion": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-a11y-content": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-buttons": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-calendar": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-date-input": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-form-field": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-i18n": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-icons": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-prop-types": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-react-utils": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-testable": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-time-select": "8.56.2-pr-snapshot-1721749364069",
+    "@instructure/ui-utils": "8.56.2-pr-snapshot-1721749364069",
     "prop-types": "^15.8.1"
   },
   "peerDependencies": {