From 372caee2be9bb8d04e6e7062a4b4b338855d7daf Mon Sep 17 00:00:00 2001 From: Greg Thompson Date: Wed, 10 Apr 2019 12:11:20 -0500 Subject: [PATCH 1/4] co-opt adjustDateOnChange prop from react-datepicker and default to true --- .../date_picker/__snapshots__/date_picker.test.js.snap | 1 + src/components/date_picker/date_picker.js | 7 +++++++ 2 files changed, 8 insertions(+) diff --git a/src/components/date_picker/__snapshots__/date_picker.test.js.snap b/src/components/date_picker/__snapshots__/date_picker.test.js.snap index db08cf1c112..cdef94b8f47 100644 --- a/src/components/date_picker/__snapshots__/date_picker.test.js.snap +++ b/src/components/date_picker/__snapshots__/date_picker.test.js.snap @@ -14,6 +14,7 @@ exports[`EuiDatePicker is rendered 1`] = ` Date: Wed, 10 Apr 2019 13:26:35 -0500 Subject: [PATCH 2/4] #1817 changelog entry --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index d518df1effe..f718a5c0d72 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ ## [`master`](https://github.com/elastic/eui/tree/master) - Re-enable installation of `@elastic/eui` via npm ([#1811](https://github.com/elastic/eui/pull/1811)) +- Added `adjustDateOnChange` prop to date pickers, enabling month and year changes to trigger `onChange` ([#1817](https://github.com/elastic/eui/pull/1817)) ## [`9.9.0`](https://github.com/elastic/eui/tree/v9.9.0) From ac8d1431a8b8b2124c3c1d43a94c637bc6328aa2 Mon Sep 17 00:00:00 2001 From: Greg Thompson Date: Thu, 11 Apr 2019 11:44:44 -0500 Subject: [PATCH 3/4] prevent month and year selections from changing selected date to beginning of month --- packages/react-datepicker.js | 71 +++++++++++++------ packages/react-datepicker/docs-site/bundle.js | 10 ++- packages/react-datepicker/src/calendar.jsx | 12 +++- packages/react-datepicker/yarn.lock | 6 +- 4 files changed, 72 insertions(+), 27 deletions(-) diff --git a/packages/react-datepicker.js b/packages/react-datepicker.js index f02134f6386..07a3467d8ee 100644 --- a/packages/react-datepicker.js +++ b/packages/react-datepicker.js @@ -3660,7 +3660,7 @@ var Calendar = function (_React$Component) { _this.props.onYearChange(date); } if (_this.props.accessibleMode) { - _this.props.updateSelection(getStartOfMonth(cloneDate(date))); + _this.handleSelectionChange(date); } }; @@ -3677,6 +3677,14 @@ var Calendar = function (_React$Component) { } } if (_this.props.accessibleMode) { + _this.handleSelectionChange(date); + } + }; + + _this.handleSelectionChange = function (date) { + if (_this.props.adjustDateOnChange) { + _this.props.updateSelection(date); + } else { _this.props.updateSelection(getStartOfMonth(cloneDate(date))); } }; @@ -4440,6 +4448,11 @@ var _toLength = function (it) { return it > 0 ? min(_toInteger(it), 0x1fffffffffffff) : 0; // pow(2, 53) - 1 == 9007199254740991 }; +var _toLength$1 = /*#__PURE__*/Object.freeze({ + default: _toLength, + __moduleExports: _toLength +}); + var max = Math.max; var min$1 = Math.min; var _toAbsoluteIndex = function (index, length) { @@ -4447,6 +4460,15 @@ var _toAbsoluteIndex = function (index, length) { return index < 0 ? max(index + length, 0) : min$1(index, length); }; +var _toAbsoluteIndex$1 = /*#__PURE__*/Object.freeze({ + default: _toAbsoluteIndex, + __moduleExports: _toAbsoluteIndex +}); + +var toLength = ( _toLength$1 && _toLength ) || _toLength$1; + +var toAbsoluteIndex = ( _toAbsoluteIndex$1 && _toAbsoluteIndex ) || _toAbsoluteIndex$1; + // false -> Array#indexOf // true -> Array#includes @@ -4455,8 +4477,8 @@ var _toAbsoluteIndex = function (index, length) { var _arrayIncludes = function (IS_INCLUDES) { return function ($this, el, fromIndex) { var O = _toIobject($this); - var length = _toLength(O.length); - var index = _toAbsoluteIndex(fromIndex, length); + var length = toLength(O.length); + var index = toAbsoluteIndex(fromIndex, length); var value; // Array#includes uses SameValueZero equality algorithm // eslint-disable-next-line no-self-compare @@ -5279,7 +5301,14 @@ exports.default = typeof _symbol2.default === "function" && _typeof(_iterator2.d }; }); -unwrapExports(_typeof_1); +var _typeof$1 = unwrapExports(_typeof_1); + +var _typeof$2 = /*#__PURE__*/Object.freeze({ + default: _typeof$1, + __moduleExports: _typeof_1 +}); + +var _typeof2 = ( _typeof$2 && _typeof$1 ) || _typeof$2; var possibleConstructorReturn$1 = createCommonjsModule(function (module, exports) { @@ -5287,7 +5316,7 @@ exports.__esModule = true; -var _typeof3 = _interopRequireDefault(_typeof_1); +var _typeof3 = _interopRequireDefault(_typeof2); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -5348,11 +5377,18 @@ var create = function create(P, D) { return $Object.create(P, D); }; -var create$1 = createCommonjsModule(function (module) { -module.exports = { "default": create, __esModule: true }; +var create$1 = /*#__PURE__*/Object.freeze({ + default: create, + __moduleExports: create +}); + +var require$$0 = ( create$1 && create ) || create$1; + +var create$2 = createCommonjsModule(function (module) { +module.exports = { "default": require$$0, __esModule: true }; }); -unwrapExports(create$1); +unwrapExports(create$2); var inherits$1 = createCommonjsModule(function (module, exports) { @@ -5364,11 +5400,11 @@ var _setPrototypeOf2 = _interopRequireDefault(setPrototypeOf$1); -var _create2 = _interopRequireDefault(create$1); +var _create2 = _interopRequireDefault(create$2); -var _typeof3 = _interopRequireDefault(_typeof_1); +var _typeof3 = _interopRequireDefault(_typeof2); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -7992,13 +8028,6 @@ if (process.env.NODE_ENV !== 'production') { var warning_1 = warning; -var warning$1 = /*#__PURE__*/Object.freeze({ - default: warning_1, - __moduleExports: warning_1 -}); - -var _warning = ( warning$1 && warning_1 ) || warning$1; - var implementation = createCommonjsModule(function (module, exports) { exports.__esModule = true; @@ -8017,7 +8046,7 @@ var _gud2 = _interopRequireDefault(gud); -var _warning2 = _interopRequireDefault(_warning); +var _warning2 = _interopRequireDefault(warning_1); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } @@ -8453,10 +8482,10 @@ function Popper$1(props) { var __DEV__ = process.env.NODE_ENV !== 'production'; -var warning$2 = function() {}; +var warning$1 = function() {}; if (__DEV__) { - warning$2 = function(condition, format, args) { + warning$1 = function(condition, format, args) { var len = arguments.length; args = new Array(len > 2 ? len - 2 : 0); for (var key = 2; key < len; key++) { @@ -8494,7 +8523,7 @@ if (__DEV__) { }; } -var warning_1$1 = warning$2; +var warning_1$1 = warning$1; var InnerReference = function (_React$Component) { _inherits$1(InnerReference, _React$Component); diff --git a/packages/react-datepicker/docs-site/bundle.js b/packages/react-datepicker/docs-site/bundle.js index 1a480f40da7..cec3ef16441 100644 --- a/packages/react-datepicker/docs-site/bundle.js +++ b/packages/react-datepicker/docs-site/bundle.js @@ -27703,7 +27703,7 @@ _this.props.onYearChange(date); } if (_this.props.accessibleMode) { - _this.props.updateSelection((0, _date_utils.getStartOfMonth)((0, _date_utils.cloneDate)(date))); + _this.handleSelectionChange(date); } }; @@ -27720,6 +27720,14 @@ } } if (_this.props.accessibleMode) { + _this.handleSelectionChange(date); + } + }; + + _this.handleSelectionChange = function (date) { + if (_this.props.adjustDateOnChange) { + _this.props.updateSelection(date); + } else { _this.props.updateSelection((0, _date_utils.getStartOfMonth)((0, _date_utils.cloneDate)(date))); } }; diff --git a/packages/react-datepicker/src/calendar.jsx b/packages/react-datepicker/src/calendar.jsx index e63a92e622e..da856bd3766 100644 --- a/packages/react-datepicker/src/calendar.jsx +++ b/packages/react-datepicker/src/calendar.jsx @@ -242,7 +242,7 @@ export default class Calendar extends React.Component { this.props.onYearChange(date); } if (this.props.accessibleMode) { - this.props.updateSelection(getStartOfMonth(cloneDate(date))); + this.handleSelectionChange(date); } }; @@ -259,10 +259,18 @@ export default class Calendar extends React.Component { } } if (this.props.accessibleMode) { - this.props.updateSelection(getStartOfMonth(cloneDate(date))); + this.handleSelectionChange(date); } }; + handleSelectionChange = date => { + if (this.props.adjustDateOnChange) { + this.props.updateSelection(date); + } else { + this.props.updateSelection(getStartOfMonth(cloneDate(date))); + } + } + handleMonthYearChange = date => { this.handleYearChange(date); this.handleMonthChange(date); diff --git a/packages/react-datepicker/yarn.lock b/packages/react-datepicker/yarn.lock index 6f8b0764737..63fa22cc062 100644 --- a/packages/react-datepicker/yarn.lock +++ b/packages/react-datepicker/yarn.lock @@ -4124,9 +4124,9 @@ har-validator@~4.2.1: har-schema "^1.0.5" har-validator@~5.1.0: - version "5.1.2" - resolved "https://registry.yarnpkg.com/har-validator/-/har-validator-5.1.2.tgz#a3891924f815c88e41c7f31112079cfef5e129e5" - integrity sha512-OFxb5MZXCUMx43X7O8LK4FKggEQx6yC5QPmOcBnYbJ9UjxEcMcrMbaR0af5HZpqeFopw2GwQRQi34ZXI7YLM5w== + version "5.1.3" + resolved "https://registry.yarnpkg.com/har-validator/-/har-validator-5.1.3.tgz#1ef89ebd3e4996557675eed9893110dc350fa080" + integrity sha512-sNvOCzEQNr/qrvJgc3UG/kD4QtlHycrzwS+6mfTrrSq97BvaYcPZZI1ZSqGSPR73Cxn4LKTD4PttRwfU7jWq5g== dependencies: ajv "^6.5.5" har-schema "^2.0.0" From 78fef48770f5e6e65f2f65816b3c81485930cf59 Mon Sep 17 00:00:00 2001 From: Greg Thompson Date: Thu, 11 Apr 2019 12:05:47 -0500 Subject: [PATCH 4/4] update changelog --- CHANGELOG.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 3941ddd1fdb..f48972d0664 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,11 +1,10 @@ ## [`master`](https://github.com/elastic/eui/tree/master) -No public interface changes since `9.9.1`. +- - Added `adjustDateOnChange` prop to date pickers, enabling month and year changes to trigger `onChange` ([#1817](https://github.com/elastic/eui/pull/1817)) ## [`9.9.1`](https://github.com/elastic/eui/tree/v9.9.1) - Re-enabled installation of `@elastic/eui` via npm ([#1811](https://github.com/elastic/eui/pull/1811)) -- Added `adjustDateOnChange` prop to date pickers, enabling month and year changes to trigger `onChange` ([#1817](https://github.com/elastic/eui/pull/1817)) **Bug fixes**