@instructure/ui-date-time-input 8.24.1-snapshot.16 → 8.24.1

package/CHANGELOG.md

@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [8.24.1](https://github.com/instructure/instructure-ui/compare/v8.24.0...v8.24.1) (2022-04-29)
+
+### Bug Fixes
+
+- **ui-date-time-input,ui-time-select:** fix selection getting lost after value change ([0604ec5](https://github.com/instructure/instructure-ui/commit/0604ec59c560ca2868fdac84d6f4948f92d38d5b))
+
 # [8.24.0](https://github.com/instructure/instructure-ui/compare/v8.23.0...v8.24.0) (2022-04-26)
 
 ### Bug Fixes

package/es/DateTimeInput/index.js

@@ -50,7 +50,6 @@ let DateTimeInput = (_dec = testable(), _dec(_class = (_class2 = class DateTimeI
     // componentDidMount()
 
     this.context = void 0;
-    this._timeInput = void 0;
     this.ref = null;
 
     this.handleRef = el => {
@@ -142,10 +141,6 @@ let DateTimeInput = (_dec = testable(), _dec(_class = (_class2 = class DateTimeI
       }
     };
 
-    this.timeInputComponentRef = node => {
-      this._timeInput = node;
-    };
-
     this.handleShowCalendar = _event => {
       this.setState({
         isShowingCalendar: true
@@ -241,8 +236,6 @@ let DateTimeInput = (_dec = testable(), _dec(_class = (_class2 = class DateTimeI
       const parsed = DateTime.parse(dateStr, this.locale(), this.timezone());
 
       if (parsed.isValid()) {
-        var _this$state, _this$_timeInput;
-
         if (doNotChangeTime && this.state.timeSelectValue) {
           // There is a selected time, adjust the parsed date to its value
           const timeParsed = DateTime.parse(this.state.timeSelectValue, this.locale(), this.timezone());
@@ -253,7 +246,7 @@ let DateTimeInput = (_dec = testable(), _dec(_class = (_class2 = class DateTimeI
           parsed.date(this.state.iso.date()).month(this.state.iso.month()).year(this.state.iso.year());
         }
 
-        const newTimeSelectValue = (_this$state = this.state) !== null && _this$state !== void 0 && _this$state.timeSelectValue ? this.state.timeSelectValue : (_this$_timeInput = this._timeInput) === null || _this$_timeInput === void 0 ? void 0 : _this$_timeInput.getBaseDate().minute(parsed.minute()).hour(parsed.hour()).toISOString();
+        const newTimeSelectValue = parsed.toISOString();
 
         if (this.isDisabledDate(parsed)) {
           let text = typeof this.props.disabledDateTimeMessage === 'function' ? this.props.disabledDateTimeMessage(parsed.toISOString(true)) : this.props.disabledDateTimeMessage;
@@ -523,7 +516,6 @@ let DateTimeInput = (_dec = testable(), _dec(_class = (_class2 = class DateTimeI
       value: this.state.timeSelectValue,
       onChange: this.handleTimeChange,
       onBlur: this.handleBlur,
-      ref: this.timeInputComponentRef,
       renderLabel: timeRenderLabel,
       locale: locale,
       format: timeFormat,

package/lib/DateTimeInput/index.js

@@ -53,7 +53,6 @@ let DateTimeInput = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 =
     // componentDidMount()
 
     this.context = void 0;
-    this._timeInput = void 0;
     this.ref = null;
 
     this.handleRef = el => {
@@ -147,10 +146,6 @@ let DateTimeInput = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 =
       }
     };
 
-    this.timeInputComponentRef = node => {
-      this._timeInput = node;
-    };
-
     this.handleShowCalendar = _event => {
       this.setState({
         isShowingCalendar: true
@@ -246,8 +241,6 @@ let DateTimeInput = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 =
       const parsed = _DateTime.DateTime.parse(dateStr, this.locale(), this.timezone());
 
       if (parsed.isValid()) {
-        var _this$state, _this$_timeInput;
-
         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());
@@ -259,7 +252,7 @@ let DateTimeInput = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 =
           parsed.date(this.state.iso.date()).month(this.state.iso.month()).year(this.state.iso.year());
         }
 
-        const newTimeSelectValue = (_this$state = this.state) !== null && _this$state !== void 0 && _this$state.timeSelectValue ? this.state.timeSelectValue : (_this$_timeInput = this._timeInput) === null || _this$_timeInput === void 0 ? void 0 : _this$_timeInput.getBaseDate().minute(parsed.minute()).hour(parsed.hour()).toISOString();
+        const newTimeSelectValue = parsed.toISOString();
 
         if (this.isDisabledDate(parsed)) {
           let text = typeof this.props.disabledDateTimeMessage === 'function' ? this.props.disabledDateTimeMessage(parsed.toISOString(true)) : this.props.disabledDateTimeMessage;
@@ -534,7 +527,6 @@ let DateTimeInput = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 =
       value: this.state.timeSelectValue,
       onChange: this.handleTimeChange,
       onBlur: this.handleBlur,
-      ref: this.timeInputComponentRef,
       renderLabel: timeRenderLabel,
       locale: locale,
       format: timeFormat,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-date-time-input",
-  "version": "8.24.1-snapshot.16+363893b5f",
+  "version": "8.24.1",
   "description": "A UI component that allows to select date and time.",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -23,26 +23,26 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-test-locator": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-test-utils": "8.24.1-snapshot.16+363893b5f"
+    "@instructure/ui-babel-preset": "8.24.1",
+    "@instructure/ui-test-locator": "8.24.1",
+    "@instructure/ui-test-utils": "8.24.1"
   },
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/debounce": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/emotion": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-a11y-content": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-buttons": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-calendar": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-date-input": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-form-field": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-i18n": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-icons": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-prop-types": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-react-utils": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-testable": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-time-select": "8.24.1-snapshot.16+363893b5f",
-    "@instructure/ui-utils": "8.24.1-snapshot.16+363893b5f",
+    "@instructure/debounce": "8.24.1",
+    "@instructure/emotion": "8.24.1",
+    "@instructure/ui-a11y-content": "8.24.1",
+    "@instructure/ui-buttons": "8.24.1",
+    "@instructure/ui-calendar": "8.24.1",
+    "@instructure/ui-date-input": "8.24.1",
+    "@instructure/ui-form-field": "8.24.1",
+    "@instructure/ui-i18n": "8.24.1",
+    "@instructure/ui-icons": "8.24.1",
+    "@instructure/ui-prop-types": "8.24.1",
+    "@instructure/ui-react-utils": "8.24.1",
+    "@instructure/ui-testable": "8.24.1",
+    "@instructure/ui-time-select": "8.24.1",
+    "@instructure/ui-utils": "8.24.1",
     "prop-types": "^15"
   },
   "peerDependencies": {
@@ -51,6 +51,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "sideEffects": false,
-  "gitHead": "363893b5f0575cc9743cdaa7fae4c404f3fb9cca"
+  "sideEffects": false
 }

package/src/DateTimeInput/index.tsx

@@ -68,7 +68,6 @@ class DateTimeInput extends Component<DateTimeInputProps, DateTimeInputState> {
 
   static contextType = ApplyLocaleContext
 
-  private _timeInput?: TimeSelect
   ref: Element | null = null // This is used by Tooltip for positioning
 
   handleRef = (el: Element | null) => {
@@ -136,13 +135,7 @@ class DateTimeInput extends Component<DateTimeInputProps, DateTimeInputState> {
             .month(this.state.iso.month())
             .year(this.state.iso.year())
         }
-        const newTimeSelectValue = this.state?.timeSelectValue
-          ? this.state.timeSelectValue
-          : this._timeInput
-              ?.getBaseDate()
-              .minute(parsed.minute())
-              .hour(parsed.hour())
-              .toISOString()
+        const newTimeSelectValue = parsed.toISOString()
         if (this.isDisabledDate(parsed)) {
           let text =
             typeof this.props.disabledDateTimeMessage === 'function'
@@ -359,10 +352,6 @@ class DateTimeInput extends Component<DateTimeInputProps, DateTimeInputState> {
     }
   }
 
-  timeInputComponentRef = (node: TimeSelect) => {
-    this._timeInput = node
-  }
-
   handleShowCalendar = (_event: SyntheticEvent) => {
     this.setState({ isShowingCalendar: true })
   }
@@ -589,7 +578,6 @@ class DateTimeInput extends Component<DateTimeInputProps, DateTimeInputState> {
           value={this.state.timeSelectValue}
           onChange={this.handleTimeChange}
           onBlur={this.handleBlur}
-          ref={this.timeInputComponentRef}
           renderLabel={timeRenderLabel}
           locale={locale}
           format={timeFormat}