@blueprintjs/datetime - npm Package Compare versions

Comparing version 1.14.0 to 1.14.1

dist/common/errors.d.ts

@@ -12,1 +12,2 @@ export declare const DATEPICKER_DEFAULT_VALUE_INVALID: string;
 export declare const DATEINPUT_WARN_DEPRECATED_OPEN_ON_FOCUS: string;
+export declare const DATERANGEINPUT_NULL_VALUE: string;

dist/common/errors.js

@@ -21,3 +21,5 @@ /*
 exports.DATEINPUT_WARN_DEPRECATED_OPEN_ON_FOCUS = ns + " DEPRECATION: <DateInput> openOnFocus is deprecated. This feature will be removed in the next major version.";
+exports.DATERANGEINPUT_NULL_VALUE = ns + " <DateRangeInput> value cannot be null. Pass undefined to clear the value and operate in " +
+    "uncontrolled mode, or pass [null, null] to clear the value and continue operating in controlled mode.";
 
 //# sourceMappingURL=errors.js.map

dist/dateRangeInput.d.ts

@@ -105,4 +105,5 @@ /// <reference types="react" />
      * The currently selected date range.
-     * If this prop is present, the component acts in a controlled manner.
-     * To display no date range in the input fields, pass `[null, null]` to the value prop.
+     * If the prop is strictly `undefined`, the component acts in an uncontrolled manner.
+     * If this prop is anything else, the component acts in a controlled manner.
+     * To display an empty value in the input fields in a controlled manner, pass `[null, null]`.
      * To display an invalid date error in either input field, pass `new Date(undefined)`
@@ -140,2 +141,3 @@ * for the appropriate date in the value prop.
     componentWillReceiveProps(nextProps: IDateRangeInputProps): void;
+    protected validateProps(props: IDateRangeInputProps): void;
     private renderInputGroup;
@@ -142,0 +144,0 @@ private handleDateRangePickerChange;

dist/dateRangeInput.js

@@ -15,2 +15,3 @@ /*
 var dateUtils_1 = require("./common/dateUtils");
+var Errors = require("./common/errors");
 var datePickerCore_1 = require("./datePickerCore");
@@ -55,50 +56,52 @@ var dateRangePicker_1 = require("./dateRangePicker");
             }
-            if (_this.props.value === undefined) {
-                var _a = dateUtils_1.fromDateRangeToMomentDateRange(selectedRange), selectedStart = _a[0], selectedEnd = _a[1];
-                var isOpen = true;
-                var isStartInputFocused = void 0;
-                var isEndInputFocused = void 0;
-                var startHoverString = void 0;
-                var endHoverString = void 0;
-                if (dateUtils_1.isMomentNull(selectedStart)) {
-                    // focus the start field by default or if only an end date is specified
-                    isStartInputFocused = true;
-                    isEndInputFocused = false;
-                    // for clarity, hide the hover string until the mouse moves over a different date
-                    startHoverString = null;
-                }
-                else if (dateUtils_1.isMomentNull(selectedEnd)) {
-                    // focus the end field if a start date is specified
-                    isStartInputFocused = false;
-                    isEndInputFocused = true;
-                    endHoverString = null;
-                }
-                else if (_this.props.closeOnSelection) {
-                    isOpen = false;
-                    isStartInputFocused = false;
-                    isEndInputFocused = false;
-                }
-                else if (_this.state.lastFocusedField === dateUtils_1.DateRangeBoundary.START) {
-                    // keep the start field focused
-                    isStartInputFocused = true;
-                    isEndInputFocused = false;
-                }
-                else {
-                    // keep the end field focused
-                    isStartInputFocused = false;
-                    isEndInputFocused = true;
-                }
-                _this.setState({
-                    isOpen: isOpen,
-                    selectedEnd: selectedEnd,
-                    selectedStart: selectedStart,
-                    isEndInputFocused: isEndInputFocused,
-                    isStartInputFocused: isStartInputFocused,
-                    startHoverString: startHoverString,
-                    endHoverString: endHoverString,
-                    endInputString: _this.getFormattedDateString(selectedEnd),
-                    startInputString: _this.getFormattedDateString(selectedStart),
-                    wasLastFocusChangeDueToHover: false,
-                });
+            var _a = dateUtils_1.fromDateRangeToMomentDateRange(selectedRange), selectedStart = _a[0], selectedEnd = _a[1];
+            var isOpen = true;
+            var isStartInputFocused;
+            var isEndInputFocused;
+            var startHoverString;
+            var endHoverString;
+            if (dateUtils_1.isMomentNull(selectedStart)) {
+                // focus the start field by default or if only an end date is specified
+                isStartInputFocused = true;
+                isEndInputFocused = false;
+                // for clarity, hide the hover string until the mouse moves over a different date
+                startHoverString = null;
             }
+            else if (dateUtils_1.isMomentNull(selectedEnd)) {
+                // focus the end field if a start date is specified
+                isStartInputFocused = false;
+                isEndInputFocused = true;
+                endHoverString = null;
+            }
+            else if (_this.props.closeOnSelection) {
+                isOpen = false;
+                isStartInputFocused = false;
+                isEndInputFocused = false;
+            }
+            else if (_this.state.lastFocusedField === dateUtils_1.DateRangeBoundary.START) {
+                // keep the start field focused
+                isStartInputFocused = true;
+                isEndInputFocused = false;
+            }
+            else {
+                // keep the end field focused
+                isStartInputFocused = false;
+                isEndInputFocused = true;
+            }
+            var baseStateChange = {
+                isOpen: isOpen,
+                isEndInputFocused: isEndInputFocused,
+                isStartInputFocused: isStartInputFocused,
+                startHoverString: startHoverString,
+                endHoverString: endHoverString,
+                endInputString: _this.getFormattedDateString(selectedEnd),
+                startInputString: _this.getFormattedDateString(selectedStart),
+                wasLastFocusChangeDueToHover: false,
+            };
+            if (_this.isControlled()) {
+                _this.setState(baseStateChange);
+            }
+            else {
+                _this.setState(tslib_1.__assign({}, baseStateChange, { selectedEnd: selectedEnd, selectedStart: selectedStart }));
+            }
             core_1.Utils.safeInvoke(_this.props.onChange, selectedRange);
@@ -275,10 +278,11 @@ };
             if (inputString.length === 0) {
-                // this case will be relevant when we start showing the hovered
-                // range in the input fields. goal is to show an empty field for
-                // clarity until the mouse moves over a different date.
+                // this case will be relevant when we start showing the hovered range in the input
+                // fields. goal is to show an empty field for clarity until the mouse moves over a
+                // different date.
+                var baseState = tslib_1.__assign({}, nextState, (_a = {}, _a[keys.inputString] = "", _a));
                 if (isValueControlled) {
-                    nextState = tslib_1.__assign({}, nextState, (_a = {}, _a[keys.inputString] = "", _a));
+                    nextState = baseState;
                 }
                 else {
-                    nextState = tslib_1.__assign({}, nextState, (_b = {}, _b[keys.inputString] = "", _b[keys.selectedValue] = moment(null), _b));
+                    nextState = tslib_1.__assign({}, baseState, (_b = {}, _b[keys.selectedValue] = moment(null), _b));
                 }
@@ -288,11 +292,12 @@ core_1.Utils.safeInvoke(_this.props.onChange, _this.getDateRangeForCallback(moment(null), boundary));
             else if (_this.isMomentValidAndInRange(maybeNextValue)) {
-                // note that error cases that depend on both fields (e.g.
-                // overlapping dates) should fall through into this block so that
-                // the UI can update immediately, possibly with an error message on
-                // the other field.
+                // note that error cases that depend on both fields (e.g. overlapping dates) should fall
+                // through into this block so that the UI can update immediately, possibly with an error
+                // message on the other field.
+                // also, clear the hover string to ensure the most recent keystroke appears.
+                var baseState = tslib_1.__assign({}, nextState, (_c = {}, _c[keys.hoverString] = null, _c[keys.inputString] = inputString, _c));
                 if (isValueControlled) {
-                    nextState = tslib_1.__assign({}, nextState, (_c = {}, _c[keys.inputString] = inputString, _c));
+                    nextState = baseState;
                 }
                 else {
-                    nextState = tslib_1.__assign({}, nextState, (_d = {}, _d[keys.inputString] = inputString, _d[keys.selectedValue] = maybeNextValue, _d));
+                    nextState = tslib_1.__assign({}, baseState, (_d = {}, _d[keys.selectedValue] = maybeNextValue, _d));
                 }
@@ -304,3 +309,4 @@ if (_this.isNextDateRangeValid(maybeNextValue, boundary)) {
             else {
-                nextState = tslib_1.__assign({}, nextState, (_f = {}, _f[keys.inputString] = inputString, _f));
+                // again, clear the hover string to ensure the most recent keystroke appears
+                nextState = tslib_1.__assign({}, nextState, (_f = {}, _f[keys.inputString] = inputString, _f[keys.hoverString] = null, _f));
             }
@@ -336,3 +342,11 @@ _this.setState(nextState);
         _this.getSelectedRange = function () {
-            var _a = _this.state, selectedStart = _a.selectedStart, selectedEnd = _a.selectedEnd;
+            var selectedStart;
+            var selectedEnd;
+            if (_this.isControlled()) {
+                _a = _this.props.value.map(dateUtils_1.fromDateToMoment), selectedStart = _a[0], selectedEnd = _a[1];
+            }
+            else {
+                selectedStart = _this.state.selectedStart;
+                selectedEnd = _this.state.selectedEnd;
+            }
             // this helper function checks if the provided boundary date *would* overlap the selected
@@ -348,2 +362,3 @@ // other boundary date. providing the already-selected start date simply tells us if we're
             });
+            var _a;
         };
@@ -365,4 +380,3 @@ _this.getInputGroupCallbackForEvent = function (e, inputProps) {
             var isInputFocused = values.isInputFocused, inputString = values.inputString, selectedValue = values.selectedValue, hoverString = values.hoverString;
-            if (hoverString != null && !_this.isControlled()) {
-                // we don't want to overwrite the inputStrings in controlled mode
+            if (hoverString != null) {
                 return hoverString;
@@ -519,21 +533,25 @@ }
             var values = _this.getStateKeysAndValuesForBoundary(boundary).values;
-            var isInputFocused = values.isInputFocused, inputString = values.inputString, selectedValue = values.selectedValue;
+            var isInputFocused = values.isInputFocused, hoverString = values.hoverString, inputString = values.inputString, selectedValue = values.selectedValue;
             var boundaryValue = (isInputFocused)
                 ? _this.dateStringToMoment(inputString)
                 : selectedValue;
-            // break down the boolean logic to an elementary level to make it
-            // utterly simple to grok.
-            if (dateUtils_1.isMomentNull(boundaryValue)) {
+            if (hoverString != null) {
+                // don't show an error state while we're hovering over a valid date.
                 return false;
             }
-            if (!boundaryValue.isValid()) {
+            else if (dateUtils_1.isMomentNull(boundaryValue)) {
+                return false;
+            }
+            else if (!boundaryValue.isValid()) {
                 return true;
             }
-            if (!_this.isMomentInRange(boundaryValue)) {
+            else if (!_this.isMomentInRange(boundaryValue)) {
                 return true;
             }
-            if (_this.doesEndBoundaryOverlapStartBoundary(boundaryValue, boundary)) {
+            else if (_this.doesEndBoundaryOverlapStartBoundary(boundaryValue, boundary)) {
                 return true;
             }
-            return false;
+            else {
+                return false;
+            }
         };
@@ -602,2 +620,7 @@ _this.isMomentValidAndInRange = function (momentDate) {
     };
+    DateRangeInput.prototype.validateProps = function (props) {
+        if (props.value === null) {
+            throw new Error(Errors.DATERANGEINPUT_NULL_VALUE);
+        }
+    };
     // Helpers
@@ -604,0 +627,0 @@ // =======

package.json

 {
   "name": "@blueprintjs/datetime",
-  "version": "1.14.0",
+  "version": "1.14.1",
   "description": "Components for interacting with dates and times",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

src/common/errors.ts

@@ -32,1 +32,5 @@ /*
     `${ns} DEPRECATION: <DateInput> openOnFocus is deprecated. This feature will be removed in the next major version.`;
+
+export const DATERANGEINPUT_NULL_VALUE =
+    `${ns} <DateRangeInput> value cannot be null. Pass undefined to clear the value and operate in ` +
+    "uncontrolled mode, or pass [null, null] to clear the value and continue operating in controlled mode.";

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1135165

increased by0.55%

Lines of code

10246

increased by0.76%

No dependency changes