From 010c8077281971eee05727f7f57222e41af921d4 Mon Sep 17 00:00:00 2001 From: Avi Klaiman Date: Sun, 10 Mar 2019 12:47:31 +0200 Subject: [PATCH] Exposing onDayMouseEnter and onMonthMouseLeave callback --- docs-site/bundle.js | 67 +++++++++++++++++++++++++++++++-------------- src/calendar.jsx | 14 ++++++++-- src/index.jsx | 18 ++++++------ 3 files changed, 68 insertions(+), 31 deletions(-) diff --git a/docs-site/bundle.js b/docs-site/bundle.js index 10946ecb97..f218dfb026 100644 --- a/docs-site/bundle.js +++ b/docs-site/bundle.js @@ -540,8 +540,7 @@ }); for ( - var es6Symbols = // 19.4.2.2, 19.4.2.3, 19.4.2.4, 19.4.2.6, 19.4.2.8, 19.4.2.9, 19.4.2.10, 19.4.2.11, 19.4.2.12, 19.4.2.13, 19.4.2.14 - "hasInstance,isConcatSpreadable,iterator,match,replace,search,species,split,toPrimitive,toStringTag,unscopables".split( + var es6Symbols = "hasInstance,isConcatSpreadable,iterator,match,replace,search,species,split,toPrimitive,toStringTag,unscopables".split( // 19.4.2.2, 19.4.2.3, 19.4.2.4, 19.4.2.6, 19.4.2.8, 19.4.2.9, 19.4.2.10, 19.4.2.11, 19.4.2.12, 19.4.2.13, 19.4.2.14 "," ), j = 0; @@ -24266,8 +24265,7 @@ }, /* 382 */ /***/ function(module, exports) { - module.exports - /** + module.exports = /** * Known issues: * * - invalid hex string literals will be recognized as a double quoted strings @@ -24281,7 +24279,7 @@ * * - special token sequence rule is not strictly following D grammar (anything following #line * up to the end of line is matched as special token sequence) - */ = function(hljs) { + */ function(hljs) { /** * Language keywords * @@ -28051,7 +28049,8 @@ }, /* 416 */ /***/ function(module, exports) { - module.exports = function(hljs) { // TODO support filter tags like :javascript, support inline HTML + module.exports = function(hljs) { + // TODO support filter tags like :javascript, support inline HTML return { case_insensitive: true, contains: [ @@ -37805,7 +37804,8 @@ }, /* 479 */ /***/ function(module, exports) { - module.exports = function(hljs) { // Base deafult colors in PB IDE: background: #FFFFDF; foreground: #000000; + module.exports = function(hljs) { + // Base deafult colors in PB IDE: background: #FFFFDF; foreground: #000000; var STRINGS = { // PB IDE color: #0080FF (Azure Radiance) className: "string", @@ -43746,7 +43746,9 @@ _this.props.disabledKeyboardNavigation, renderCustomHeader: _this.props.renderCustomHeader, popperProps: _this.props.popperProps, - renderDayContents: _this.props.renderDayContents + renderDayContents: _this.props.renderDayContents, + onDayMouseEnter: _this.props.onDayMouseEnter, + onMonthMouseLeave: _this.props.onMonthMouseLeave }, _this.props.children ); @@ -44427,11 +44429,13 @@ }; _this.handleDayMouseEnter = function(day) { - return _this.setState({ selectingDate: day }); + _this.setState({ selectingDate: day }); + _this.props.onDayMouseEnter && _this.props.onDayMouseEnter(day); }; _this.handleMonthMouseLeave = function() { - return _this.setState({ selectingDate: null }); + _this.setState({ selectingDate: null }); + _this.props.onMonthMouseLeave && _this.props.onMonthMouseLeave(); }; _this.handleYearChange = function(date) { @@ -45062,7 +45066,9 @@ previousMonthButtonLabel: _propTypes2.default.string, nextMonthButtonLabel: _propTypes2.default.string, renderCustomHeader: _propTypes2.default.func, - renderDayContents: _propTypes2.default.func + renderDayContents: _propTypes2.default.func, + onDayMouseEnter: _propTypes2.default.func, + onMonthMouseLeave: _propTypes2.default.func }; exports.default = Calendar; @@ -46124,10 +46130,16 @@ } function isDayInRange(day, startDate, endDate) { - return (0, _isWithinInterval2.default)(day, { - start: startDate, - end: endDate - }); + var valid = void 0; + try { + valid = (0, _isWithinInterval2.default)(day, { + start: startDate, + end: endDate + }); + } catch (err) { + valid = false; + } + return valid; } // *** Diffing *** @@ -46158,7 +46170,7 @@ } function getFormattedWeekdayInLocale(date, formatFunc, locale) { - return formatFunc(formatDate(date, "dddd", locale)); + return formatFunc(formatDate(date, "EEEE", locale)); } function getWeekdayMinInLocale(date, locale) { @@ -46264,10 +46276,17 @@ (0, _setMinutes2.default)(base, (0, _getMinutes2.default)(maxTime)), (0, _getHours2.default)(maxTime) ); - return !(0, _isWithinInterval2.default)(baseTime, { - start: min, - end: max - }); + + var valid = void 0; + try { + valid = !(0, _isWithinInterval2.default)(baseTime, { + start: min, + end: max + }); + } catch (err) { + valid = false; + } + return valid; } function monthDisabledBefore(day) { @@ -62934,6 +62953,14 @@ _react2.default.createElement( "code", { className: "jsx" }, + "// Note: Make sure to npm install the right version of date-fns as", + _react2.default.createElement("br", null), + "// specified in packaged.json. The default one may not be compatiable", + _react2.default.createElement("br", null), + "// npm install --save date-fns@version", + _react2.default.createElement("br", null), + "import DatePicker, { registerLocale } from 'react-datepicker';", + _react2.default.createElement("br", null), "import enGB from 'date-fns/locale/en-GB';", _react2.default.createElement("br", null), "registerLocale('en-GB', enGB);", diff --git a/src/calendar.jsx b/src/calendar.jsx index 62859347a5..01e558797e 100644 --- a/src/calendar.jsx +++ b/src/calendar.jsx @@ -112,7 +112,9 @@ export default class Calendar extends React.Component { previousMonthButtonLabel: PropTypes.string, nextMonthButtonLabel: PropTypes.string, renderCustomHeader: PropTypes.func, - renderDayContents: PropTypes.func + renderDayContents: PropTypes.func, + onDayMouseEnter: PropTypes.func, + onMonthMouseLeave: PropTypes.func }; static get defaultProps() { @@ -216,9 +218,15 @@ export default class Calendar extends React.Component { handleDayClick = (day, event, monthSelectedIn) => this.props.onSelect(day, event, monthSelectedIn); - handleDayMouseEnter = day => this.setState({ selectingDate: day }); + handleDayMouseEnter = day => { + this.setState({ selectingDate: day }); + this.props.onDayMouseEnter && this.props.onDayMouseEnter(day); + }; - handleMonthMouseLeave = () => this.setState({ selectingDate: null }); + handleMonthMouseLeave = () => { + this.setState({ selectingDate: null }); + this.props.onMonthMouseLeave && this.props.onMonthMouseLeave(); + }; handleYearChange = date => { if (this.props.onYearChange) { diff --git a/src/index.jsx b/src/index.jsx index 5fd0c06827..8c15f27df6 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -243,10 +243,10 @@ export default class DatePicker extends React.Component { this.props.openToDate ? this.props.openToDate : this.props.selectsEnd && this.props.startDate - ? this.props.startDate - : this.props.selectsStart && this.props.endDate - ? this.props.endDate - : newDate(); + ? this.props.startDate + : this.props.selectsStart && this.props.endDate + ? this.props.endDate + : newDate(); calcInitialState = () => { const defaultPreSelection = this.getPreSelection(); @@ -256,8 +256,8 @@ export default class DatePicker extends React.Component { minDate && isBefore(defaultPreSelection, minDate) ? minDate : maxDate && isAfter(defaultPreSelection, maxDate) - ? maxDate - : defaultPreSelection; + ? maxDate + : defaultPreSelection; return { open: this.props.startOpen || false, preventFocus: false, @@ -669,6 +669,8 @@ export default class DatePicker extends React.Component { renderCustomHeader={this.props.renderCustomHeader} popperProps={this.props.popperProps} renderDayContents={this.props.renderDayContents} + onDayMouseEnter={this.props.onDayMouseEnter} + onMonthMouseLeave={this.props.onMonthMouseLeave} > {this.props.children} @@ -686,8 +688,8 @@ export default class DatePicker extends React.Component { typeof this.props.value === "string" ? this.props.value : typeof this.state.inputValue === "string" - ? this.state.inputValue - : safeDateFormat(this.props.selected, this.props); + ? this.state.inputValue + : safeDateFormat(this.props.selected, this.props); return React.cloneElement(customInput, { [customInputRef]: input => {