From 4ac5d4d249066d4e2bfd70543a978610284fa712 Mon Sep 17 00:00:00 2001 From: Gautam Pahuja <32642691+gautam-relayr@users.noreply.github.com> Date: Mon, 25 Mar 2019 13:12:26 +0100 Subject: [PATCH] Month year picker (#1680) * add basic month picker * Added new option of Month/Year picker * Add tests --- docs-site/bundle.js | 2529 ++++++++++++++++------- docs-site/src/example_components.jsx | 5 + docs-site/src/examples/month_picker.jsx | 44 + docs-site/style.css | 56 +- src/calendar.jsx | 67 +- src/index.jsx | 19 +- src/month.jsx | 53 +- src/stylesheets/datepicker.scss | 10 +- test/calendar_test.js | 48 + test/month_test.js | 23 +- 10 files changed, 2089 insertions(+), 765 deletions(-) create mode 100644 docs-site/src/examples/month_picker.jsx diff --git a/docs-site/bundle.js b/docs-site/bundle.js index 8ebdedf03..886a066d6 100644 --- a/docs-site/bundle.js +++ b/docs-site/bundle.js @@ -319,7 +319,7 @@ }, /* 3 */ [ - 811, + 821, 4, 5, 6, @@ -357,9 +357,9 @@ typeof window != "undefined" && window.Math == Math ? window : typeof self != "undefined" && self.Math == Math - ? self - : // eslint-disable-next-line no-new-func - Function("return this")()); + ? self + : // eslint-disable-next-line no-new-func + Function("return this")()); if (typeof __g == "number") __g = global; // eslint-disable-line no-undef /***/ @@ -374,7 +374,7 @@ /***/ }, /* 6 */ - [812, 7], + [822, 7], /* 7 */ /***/ function(module, exports) { module.exports = function(exec) { @@ -405,8 +405,8 @@ var target = IS_GLOBAL ? global : IS_STATIC - ? global[name] || (global[name] = {}) - : (global[name] || {})[PROTOTYPE]; + ? global[name] || (global[name] = {}) + : (global[name] || {})[PROTOTYPE]; var exports = IS_GLOBAL ? core : core[name] || (core[name] = {}); var expProto = exports[PROTOTYPE] || (exports[PROTOTYPE] = {}); var key, own, out, exp; @@ -421,8 +421,8 @@ IS_BIND && own ? ctx(out, global) : IS_PROTO && typeof out == "function" - ? ctx(Function.call, out) - : out; + ? ctx(Function.call, out) + : out; // extend global if (target) redefine(target, key, out, type & $export.U); // export @@ -452,11 +452,11 @@ /***/ }, /* 10 */ - [813, 11, 17, 6], + [823, 11, 17, 6], /* 11 */ - [814, 12, 14, 16, 6], + [824, 12, 14, 16, 6], /* 12 */ - [815, 13], + [825, 13], /* 13 */ /***/ function(module, exports) { module.exports = function(it) { @@ -466,11 +466,11 @@ /***/ }, /* 14 */ - [816, 6, 7, 15], + [826, 6, 7, 15], /* 15 */ - [817, 13, 4], + [827, 13, 4], /* 16 */ - [818, 13], + [828, 13], /* 17 */ /***/ function(module, exports) { module.exports = function(bitmap, value) { @@ -537,7 +537,7 @@ /***/ }, /* 20 */ - [819, 21], + [829, 21], /* 21 */ /***/ function(module, exports) { module.exports = function(it) { @@ -549,17 +549,17 @@ /***/ }, /* 22 */ - [820, 19, 13, 5, 11, 7], + [830, 19, 13, 5, 11, 7], /* 23 */ - [821, 4], + [831, 4], /* 24 */ - [822, 11, 5, 25], + [832, 11, 5, 25], /* 25 */ - [823, 23, 19, 4], + [833, 23, 19, 4], /* 26 */ - [824, 25], + [834, 25], /* 27 */ - [825, 4, 9, 28, 26, 11], + [835, 4, 9, 28, 26, 11], /* 28 */ /***/ function(module, exports) { module.exports = false; @@ -567,15 +567,15 @@ /***/ }, /* 29 */ - [826, 30, 42, 43], + [836, 30, 42, 43], /* 30 */ - [827, 31, 41], + [837, 31, 41], /* 31 */ - [828, 5, 32, 36, 40], + [838, 5, 32, 36, 40], /* 32 */ - [829, 33, 35], + [839, 33, 35], /* 33 */ - [830, 34], + [840, 34], /* 34 */ /***/ function(module, exports) { var toString = {}.toString; @@ -597,9 +597,9 @@ /***/ }, /* 36 */ - [831, 32, 37, 39], + [841, 32, 37, 39], /* 37 */ - [832, 38], + [842, 38], /* 38 */ /***/ function(module, exports) { // 7.1.4 ToInteger @@ -612,9 +612,9 @@ /***/ }, /* 39 */ - [833, 38], + [843, 38], /* 40 */ - [834, 23, 19], + [844, 23, 19], /* 41 */ /***/ function(module, exports) { // IE 8- don't enum bug keys @@ -637,21 +637,21 @@ /***/ }, /* 44 */ - [835, 34], + [845, 34], /* 45 */ - [836, 12, 46, 41, 40, 15, 47], + [846, 12, 46, 41, 40, 15, 47], /* 46 */ - [837, 11, 12, 30, 6], + [847, 11, 12, 30, 6], /* 47 */ - [838, 4], + [848, 4], /* 48 */ - [839, 32, 49], + [849, 32, 49], /* 49 */ - [840, 31, 41], + [850, 31, 41], /* 50 */ - [841, 43, 17, 32, 16, 5, 14, 6], + [851, 43, 17, 32, 16, 5, 14, 6], /* 51 */ - [842, 8, 45], + [852, 8, 45], /* 52 */ /***/ function(module, exports, __webpack_require__) { var $export = __webpack_require__(8); @@ -724,9 +724,9 @@ /***/ }, /* 57 */ - [843, 35], + [853, 35], /* 58 */ - [844, 5, 57, 40], + [854, 5, 57, 40], /* 59 */ /***/ function(module, exports, __webpack_require__) { // 19.1.2.14 Object.keys(O) @@ -830,9 +830,7 @@ __webpack_require__(55)("isExtensible", function($isExtensible) { return function isExtensible(it) { return isObject(it) - ? $isExtensible - ? $isExtensible(it) - : true + ? $isExtensible ? $isExtensible(it) : true : false; }; }); @@ -840,9 +838,9 @@ /***/ }, /* 67 */ - [845, 8, 68], + [855, 8, 68], /* 68 */ - [846, 30, 42, 43, 57, 33, 7], + [856, 30, 42, 43, 57, 33, 7], /* 69 */ /***/ function(module, exports, __webpack_require__) { // 19.1.3.10 Object.is(value1, value2) @@ -864,9 +862,9 @@ /***/ }, /* 71 */ - [847, 8, 72], + [857, 8, 72], /* 72 */ - [848, 13, 12, 20, 50], + [858, 13, 12, 20, 50], /* 73 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -914,17 +912,17 @@ return it === undefined ? "Undefined" : it === null - ? "Null" - : // @@toStringTag case - typeof (T = tryGet((O = Object(it)), TAG)) == "string" - ? T - : // builtinTag case - ARG - ? cof(O) - : // ES3 arguments fallback - (B = cof(O)) == "Object" && typeof O.callee == "function" - ? "Arguments" - : B; + ? "Null" + : // @@toStringTag case + typeof (T = tryGet((O = Object(it)), TAG)) == "string" + ? T + : // builtinTag case + ARG + ? cof(O) + : // ES3 arguments fallback + (B = cof(O)) == "Object" && typeof O.callee == "function" + ? "Arguments" + : B; }; /***/ @@ -1313,9 +1311,7 @@ var pow = function(x, n, acc) { return n === 0 ? acc - : n % 2 === 1 - ? pow(x, n - 1, acc * x) - : pow(x * x, n / 2, acc); + : n % 2 === 1 ? pow(x, n - 1, acc * x) : pow(x * x, n / 2, acc); }; var log = function(x) { var n = 0; @@ -1607,8 +1603,8 @@ return (x = +x) < 1 ? NaN : x > 94906265.62425156 - ? Math.log(x) + Math.LN2 - : log1p(x - 1 + sqrt(x - 1) * sqrt(x + 1)); + ? Math.log(x) + Math.LN2 + : log1p(x - 1 + sqrt(x - 1) * sqrt(x + 1)); } } ); @@ -1621,9 +1617,7 @@ module.exports = Math.log1p || function log1p(x) { - return (x = +x) > -1e-8 && x < 1e-8 - ? x - (x * x) / 2 - : Math.log(1 + x); + return (x = +x) > -1e-8 && x < 1e-8 ? x - x * x / 2 : Math.log(1 + x); }; /***/ @@ -1637,9 +1631,7 @@ function asinh(x) { return !isFinite((x = +x)) || x == 0 ? x - : x < 0 - ? -asinh(-x) - : Math.log(x + Math.sqrt(x * x + 1)); + : x < 0 ? -asinh(-x) : Math.log(x + Math.sqrt(x * x + 1)); } // Tor Browser bug: Math.asinh(0) -> -0 @@ -1745,9 +1737,7 @@ ? function expm1(x) { return (x = +x) == 0 ? x - : x > -1e-6 && x < 1e-6 - ? x + (x * x) / 2 - : Math.exp(x) - 1; + : x > -1e-6 && x < 1e-6 ? x + x * x / 2 : Math.exp(x) - 1; } : $expm1; @@ -1946,9 +1936,7 @@ var b = expm1(-x); return a == Infinity ? 1 - : b == Infinity - ? -1 - : (a - b) / (exp(x) + exp(-x)); + : b == Infinity ? -1 : (a - b) / (exp(x) + exp(-x)); } }); @@ -1996,7 +1984,7 @@ ? fromCharCode(code) : fromCharCode( ((code -= 0x10000) >> 10) + 0xd800, - (code % 0x400) + 0xdc00 + code % 0x400 + 0xdc00 ) ); } @@ -2044,11 +2032,11 @@ /***/ }, /* 126 */ - [849, 127, 128], + [859, 127, 128], /* 127 */ - [850, 38, 35], + [860, 38, 35], /* 128 */ - [851, 28, 8, 18, 10, 5, 129, 130, 24, 58, 25], + [861, 28, 8, 18, 10, 5, 129, 130, 24, 58, 25], /* 129 */ /***/ function(module, exports) { module.exports = {}; @@ -2056,7 +2044,7 @@ /***/ }, /* 130 */ - [852, 45, 17, 24, 10, 25], + [862, 45, 17, 24, 10, 25], /* 131 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -2955,9 +2943,7 @@ var index = 0; var result = IS_MAP ? create($this, length) - : IS_FILTER - ? create($this, 0) - : undefined; + : IS_FILTER ? create($this, 0) : undefined; var val, res; for (; length > index; index++) if (NO_HOLES || index in self) { @@ -3417,7 +3403,7 @@ /***/ }, /* 194 */ - [853, 187, 195, 129, 32, 128], + [863, 187, 195, 129, 32, 128], /* 195 */ /***/ function(module, exports) { module.exports = function(done, value) { @@ -3539,9 +3525,7 @@ "/", "flags" in R ? R.flags - : !DESCRIPTORS && R instanceof RegExp - ? $flags.call(R) - : undefined + : !DESCRIPTORS && R instanceof RegExp ? $flags.call(R) : undefined ); }); // FF44- RegExp#toString has a wrong name @@ -4657,26 +4641,26 @@ : fn.call(this, a === 0 ? 0 : a); } : KEY == "has" - ? function has(a) { - return IS_WEAK && !isObject(a) - ? false - : fn.call(this, a === 0 ? 0 : a); - } - : KEY == "get" - ? function get(a) { - return IS_WEAK && !isObject(a) - ? undefined - : fn.call(this, a === 0 ? 0 : a); - } - : KEY == "add" - ? function add(a) { - fn.call(this, a === 0 ? 0 : a); - return this; - } - : function set(a, b) { - fn.call(this, a === 0 ? 0 : a, b); - return this; - } + ? function has(a) { + return IS_WEAK && !isObject(a) + ? false + : fn.call(this, a === 0 ? 0 : a); + } + : KEY == "get" + ? function get(a) { + return IS_WEAK && !isObject(a) + ? undefined + : fn.call(this, a === 0 ? 0 : a); + } + : KEY == "add" + ? function add(a) { + fn.call(this, a === 0 ? 0 : a); + return this; + } + : function set(a, b) { + fn.call(this, a === 0 ? 0 : a, b); + return this; + } ); }; if ( @@ -5872,9 +5856,7 @@ value = (value = Math.round(value)) < 0 ? 0 - : value > 0xff - ? 0xff - : value & 0xff; + : value > 0xff ? 0xff : value & 0xff; data.v[SETTER](index * BYTES + data.o, value, LITTLE_ENDIAN); }; var addElement = function(that, index) { @@ -5962,8 +5944,8 @@ return $length !== undefined ? new Base(data, toOffset($offset, BYTES), $length) : $offset !== undefined - ? new Base(data, toOffset($offset, BYTES)) - : new Base(data); + ? new Base(data, toOffset($offset, BYTES)) + : new Base(data); } if (TYPED_ARRAY in data) return fromList(TypedArray, data); return $from.call(TypedArray, data); @@ -6367,9 +6349,7 @@ if ((desc = gOPD.f(target, propertyKey))) return has(desc, "value") ? desc.value - : desc.get !== undefined - ? desc.get.call(receiver) - : undefined; + : desc.get !== undefined ? desc.get.call(receiver) : undefined; if (isObject((proto = getPrototypeOf(target)))) return get(proto, propertyKey, receiver); } @@ -6849,9 +6829,9 @@ /***/ }, /* 264 */ - [854, 27], + [864, 27], /* 265 */ - [855, 27], + [865, 27], /* 266 */ /***/ function(module, exports, __webpack_require__) { // https://github.com/tc39/proposal-object-getownpropertydescriptors @@ -7303,7 +7283,7 @@ ) return NaN; if (x === Infinity || x === -Infinity) return x; - return ((x - inLow) * (outHigh - outLow)) / (inHigh - inLow) + outLow; + return (x - inLow) * (outHigh - outLow) / (inHigh - inLow) + outLow; }; /***/ @@ -7671,9 +7651,7 @@ if (parent === null) return oKeys; var pKeys = ordinaryMetadataKeys(parent, P); return pKeys.length - ? oKeys.length - ? from(new Set(oKeys.concat(pKeys))) - : pKeys + ? oKeys.length ? from(new Set(oKeys.concat(pKeys))) : pKeys : oKeys; }; @@ -8928,10 +8906,8 @@ typeof global === "object" ? global : typeof window === "object" - ? window - : typeof self === "object" - ? self - : this + ? window + : typeof self === "object" ? self : this ); /* WEBPACK VAR INJECTION */ @@ -9668,12 +9644,12 @@ la.hasOwnProperty(a) ? (a = !0) : (b = ua(a)) - ? (a = - b.hasBooleanValue || - b.hasStringBooleanValue || - b.hasOverloadedBooleanValue) - : ((a = a.toLowerCase().slice(0, 5)), - (a = "data-" === a || "aria-" === a)), + ? (a = + b.hasBooleanValue || + b.hasStringBooleanValue || + b.hasOverloadedBooleanValue) + : ((a = a.toLowerCase().slice(0, 5)), + (a = "data-" === a || "aria-" === a)), a ); case "undefined": @@ -10207,9 +10183,7 @@ a.hasOwnProperty(e) && ((b = a[e]) ? (this[e] = b(c)) - : "target" === e - ? (this.target = d) - : (this[e] = c[e])); + : "target" === e ? (this.target = d) : (this[e] = c[e])); this.isDefaultPrevented = (null != c.defaultPrevented ? c.defaultPrevented : !1 === c.returnValue) @@ -10704,9 +10678,7 @@ var b = this.nativeEvent; return b.getModifierState ? b.getModifierState(a) - : (a = Yc[a]) - ? !!b[a] - : !1; + : (a = Yc[a]) ? !!b[a] : !1; } function $c() { return Zc; @@ -10757,8 +10729,8 @@ d.window === d ? d : (e = d.ownerDocument) - ? e.defaultView || e.parentWindow - : window; + ? e.defaultView || e.parentWindow + : window; "topMouseOut" === a ? ((a = b), (b = (b = c.relatedTarget || c.toElement) ? pb(b) : null)) @@ -10785,9 +10757,7 @@ a = a.type; return "string" === typeof a ? a - : "function" === typeof a - ? a.displayName || a.name - : null; + : "function" === typeof a ? a.displayName || a.name : null; } function fd(a) { var b = a; @@ -11147,14 +11117,14 @@ "selectionStart" in c && Fd(c) ? (c = { start: c.selectionStart, end: c.selectionEnd }) : window.getSelection - ? ((c = window.getSelection()), - (c = { - anchorNode: c.anchorNode, - anchorOffset: c.anchorOffset, - focusNode: c.focusNode, - focusOffset: c.focusOffset - })) - : (c = void 0); + ? ((c = window.getSelection()), + (c = { + anchorNode: c.anchorNode, + anchorOffset: c.anchorOffset, + focusNode: c.focusNode, + focusOffset: c.focusOffset + })) + : (c = void 0); return Kd && ea(Kd, c) ? null : ((Kd = c), @@ -11170,9 +11140,7 @@ var e = d.window === d ? d.document - : 9 === d.nodeType - ? d - : d.ownerDocument, + : 9 === d.nodeType ? d : d.ownerDocument, f; if (!(f = !e)) { a: { @@ -11305,8 +11273,8 @@ return "keypress" === a.type ? ((a = Rd(a)), 13 === a ? "Enter" : String.fromCharCode(a)) : "keydown" === a.type || "keyup" === a.type - ? Td[a.keyCode] || "Unidentified" - : ""; + ? Td[a.keyCode] || "Unidentified" + : ""; }, location: null, ctrlKey: null, @@ -11325,9 +11293,7 @@ which: function(a) { return "keypress" === a.type ? Rd(a) - : "keydown" === a.type || "keyup" === a.type - ? a.keyCode - : 0; + : "keydown" === a.type || "keyup" === a.type ? a.keyCode : 0; } }); function Vd(a, b, c, d) { @@ -11362,18 +11328,14 @@ deltaX: function(a) { return "deltaX" in a ? a.deltaX - : "wheelDeltaX" in a - ? -a.wheelDeltaX - : 0; + : "wheelDeltaX" in a ? -a.wheelDeltaX : 0; }, deltaY: function(a) { return "deltaY" in a ? a.deltaY : "wheelDeltaY" in a - ? -a.wheelDeltaY - : "wheelDelta" in a - ? -a.wheelDelta - : 0; + ? -a.wheelDeltaY + : "wheelDelta" in a ? -a.wheelDelta : 0; }, deltaZ: null, deltaMode: null @@ -11603,10 +11565,10 @@ (d.type = e), (d.pendingProps = a.props)) : "string" === typeof e - ? ((d = new Y(5, f, b)), (d.type = e), (d.pendingProps = a.props)) - : "object" === typeof e && null !== e && "number" === typeof e.tag - ? ((d = e), (d.pendingProps = a.props)) - : D("130", null == e ? e : typeof e, ""); + ? ((d = new Y(5, f, b)), (d.type = e), (d.pendingProps = a.props)) + : "object" === typeof e && null !== e && "number" === typeof e.tag + ? ((d = e), (d.pendingProps = a.props)) + : D("130", null == e ? e : typeof e, ""); d.expirationTime = c; return d; } @@ -11704,8 +11666,8 @@ null === a ? Be(d, b) : null === d.last || null === a.last - ? (Be(d, b), Be(a, b)) - : (Be(d, b), (a.last = b)); + ? (Be(d, b), Be(a, b)) + : (Be(d, b), (a.last = b)); } function De(a, b, c, d) { a = a.partialState; @@ -11899,8 +11861,8 @@ "function" === typeof L.shouldComponentUpdate ? L.shouldComponentUpdate(F, e, x) : G.prototype && G.prototype.isPureReactComponent - ? !ea(k, F) || !ea(u, e) - : !0; + ? !ea(k, F) || !ea(u, e) + : !0; } F ? ("function" === typeof g.componentWillUpdate && @@ -12411,8 +12373,8 @@ null === a ? af(b, b.child, c, d) : a.child === b.child - ? Ze(b, b.child, c, d) - : $e(b, b.child, c, d); + ? Ze(b, b.child, c, d) + : $e(b, b.child, c, d); } function k(a, b) { var c = b.ref; @@ -12602,8 +12564,8 @@ null === a ? af(b, b.stateNode, d, c) : a.child === b.child - ? Ze(b, b.stateNode, d, c) - : $e(b, b.stateNode, d, c); + ? Ze(b, b.stateNode, d, c) + : $e(b, b.stateNode, d, c); b.memoizedProps = e; return b.stateNode; case 9: @@ -12697,9 +12659,7 @@ (z = function(a, b, c, e) { c !== e && d(b); })) - : r - ? D("235") - : D("236"); + : r ? D("235") : D("236"); return { completeWork: function(a, b, c) { var p = b.pendingProps; @@ -12972,12 +12932,8 @@ for (var e = a; ; ) { if (5 === e.tag || 6 === e.tag) c - ? d - ? G(b, e.stateNode, c) - : L(b, e.stateNode, c) - : d - ? F(b, e.stateNode) - : x(b, e.stateNode); + ? d ? G(b, e.stateNode, c) : L(b, e.stateNode, c) + : d ? F(b, e.stateNode) : x(b, e.stateNode); else if (4 !== e.tag && null !== e.child) { e.child["return"] = e; e = e.child; @@ -13295,18 +13251,16 @@ h & 36 && zg(q.alternate, q); h & 128 && Ag(q); if (h & 64) - switch ( - ((e = q), - (f = void 0), - null !== P && - ((f = P.get(e)), - P["delete"](e), - null == f && - null !== e.alternate && - ((e = e.alternate), (f = P.get(e)), P["delete"](e))), - null == f ? D("184") : void 0, - e.tag) - ) { + switch (((e = q), + (f = void 0), + null !== P && + ((f = P.get(e)), + P["delete"](e), + null == f && + null !== e.alternate && + ((e = e.alternate), (f = P.get(e)), P["delete"](e))), + null == f ? D("184") : void 0, + e.tag)) { case 2: e.stateNode.componentDidCatch(f.error, { componentStack: f.componentStack @@ -13516,9 +13470,7 @@ ":" + k.lineNumber + ")" - : n - ? " (created by " + n + ")" - : ""); + : n ? " (created by " + n + ")" : ""); break a; default: Fa = ""; @@ -13568,13 +13520,7 @@ function y(a) { return 0 !== ja ? ja - : ma - ? Lb - ? 1 - : J - : !Cg || a.internalContextTag & 1 - ? n() - : 1; + : ma ? (Lb ? 1 : J) : !Cg || a.internalContextTag & 1 ? n() : 1; } function u(a, b) { return x(a, b, !1); @@ -13606,9 +13552,7 @@ Ga || (ka ? Nb && z(c, 1) - : 1 === d - ? I(1, null) - : hb || ((hb = !0), Ie(T))); + : 1 === d ? I(1, null) : hb || ((hb = !0), Ie(T))); } else break; a = a["return"]; } @@ -14002,15 +13946,16 @@ (d.hasNumericValue && isNaN(c)) || (d.hasPositiveNumericValue && 1 > c) || (d.hasOverloadedBooleanValue && !1 === c) - ? Ef(a, b) - : d.mustUseProperty - ? (a[d.propertyName] = c) - : ((b = d.attributeName), - (e = d.attributeNamespace) - ? a.setAttributeNS(e, b, "" + c) - : d.hasBooleanValue || (d.hasOverloadedBooleanValue && !0 === c) - ? a.setAttribute(b, "") - : a.setAttribute(b, "" + c)); + ? Ef(a, b) + : d.mustUseProperty + ? (a[d.propertyName] = c) + : ((b = d.attributeName), + (e = d.attributeNamespace) + ? a.setAttributeNS(e, b, "" + c) + : d.hasBooleanValue || + (d.hasOverloadedBooleanValue && !0 === c) + ? a.setAttribute(b, "") + : a.setAttribute(b, "" + c)); } else Ff(a, b, ta(b, c) ? c : null); } function Ff(a, b, c) { @@ -14022,8 +13967,8 @@ ? (b = c.mutationMethod) ? b(a, void 0) : c.mustUseProperty - ? (a[c.propertyName] = c.hasBooleanValue ? !1 : "") - : a.removeAttribute(c.attributeName) + ? (a[c.propertyName] = c.hasBooleanValue ? !1 : "") + : a.removeAttribute(c.attributeName) : a.removeAttribute(b); } function Gf(a, b) { @@ -14190,8 +14135,8 @@ return null == a || "http://www.w3.org/1999/xhtml" === a ? Tf(b) : "http://www.w3.org/2000/svg" === a && "foreignObject" === b - ? "http://www.w3.org/1999/xhtml" - : a; + ? "http://www.w3.org/1999/xhtml" + : a; } var Vf = void 0, Wf = (function(a) { @@ -14330,8 +14275,8 @@ "number" !== typeof f || 0 === f || ($f.hasOwnProperty(e) && $f[e]) - ? ("" + f).trim() - : f + "px"; + ? ("" + f).trim() + : f + "px"; "float" === c && (c = "cssFloat"); d ? a.setProperty(c, e) : (a[c] = e); } @@ -14401,22 +14346,22 @@ ? xc("wheel") ? U("topWheel", "wheel", a) : xc("mousewheel") - ? U("topWheel", "mousewheel", a) - : U("topWheel", "DOMMouseScroll", a) + ? U("topWheel", "mousewheel", a) + : U("topWheel", "DOMMouseScroll", a) : "topScroll" === e - ? rd("topScroll", "scroll", a) - : "topFocus" === e || "topBlur" === e - ? (rd("topFocus", "focus", a), - rd("topBlur", "blur", a), - (c.topBlur = !0), - (c.topFocus = !0)) - : "topCancel" === e - ? (xc("cancel", !0) && rd("topCancel", "cancel", a), - (c.topCancel = !0)) - : "topClose" === e - ? (xc("close", !0) && rd("topClose", "close", a), - (c.topClose = !0)) - : yd.hasOwnProperty(e) && U(e, yd[e], a), + ? rd("topScroll", "scroll", a) + : "topFocus" === e || "topBlur" === e + ? (rd("topFocus", "focus", a), + rd("topBlur", "blur", a), + (c.topBlur = !0), + (c.topFocus = !0)) + : "topCancel" === e + ? (xc("cancel", !0) && rd("topCancel", "cancel", a), + (c.topCancel = !0)) + : "topClose" === e + ? (xc("close", !0) && rd("topClose", "close", a), + (c.topClose = !0)) + : yd.hasOwnProperty(e) && U(e, yd[e], a), (c[e] = !0)); } } @@ -14528,19 +14473,17 @@ "style" === k ? bg(a, h, gg) : "dangerouslySetInnerHTML" === k - ? ((h = h ? h.__html : void 0), null != h && Wf(a, h)) - : "children" === k - ? "string" === typeof h - ? ("textarea" !== b || "" !== h) && Zf(a, h) - : "number" === typeof h && Zf(a, "" + h) - : "suppressContentEditableWarning" !== k && - "suppressHydrationWarning" !== k && - "autoFocus" !== k && - (Pa.hasOwnProperty(k) - ? null != h && hg(d, k) - : e - ? Ff(a, k, h) - : null != h && Df(a, k, h)); + ? ((h = h ? h.__html : void 0), null != h && Wf(a, h)) + : "children" === k + ? "string" === typeof h + ? ("textarea" !== b || "" !== h) && Zf(a, h) + : "number" === typeof h && Zf(a, "" + h) + : "suppressContentEditableWarning" !== k && + "suppressHydrationWarning" !== k && + "autoFocus" !== k && + (Pa.hasOwnProperty(k) + ? null != h && hg(d, k) + : e ? Ff(a, k, h) : null != h && Df(a, k, h)); } switch (b) { case "input": @@ -14632,14 +14575,14 @@ (b = b ? b.__html : void 0), null != h && b !== h && (f = f || []).push(g, "" + h)) : "children" === g - ? b === h || - ("string" !== typeof h && "number" !== typeof h) || - (f = f || []).push(g, "" + h) - : "suppressContentEditableWarning" !== g && - "suppressHydrationWarning" !== g && - (Pa.hasOwnProperty(g) - ? (null != h && hg(e, g), f || b === h || (f = [])) - : (f = f || []).push(g, h)); + ? b === h || + ("string" !== typeof h && "number" !== typeof h) || + (f = f || []).push(g, "" + h) + : "suppressContentEditableWarning" !== g && + "suppressHydrationWarning" !== g && + (Pa.hasOwnProperty(g) + ? (null != h && hg(e, g), f || b === h || (f = [])) + : (f = f || []).push(g, h)); } a && (f = f || []).push("style", a); return f; @@ -14653,16 +14596,12 @@ "style" === g ? bg(a, k, gg) : "dangerouslySetInnerHTML" === g - ? Wf(a, k) - : "children" === g - ? Zf(a, k) - : d - ? null != k - ? Ff(a, g, k) - : a.removeAttribute(g) - : null != k - ? Df(a, g, k) - : Ef(a, g); + ? Wf(a, k) + : "children" === g + ? Zf(a, k) + : d + ? null != k ? Ff(a, g, k) : a.removeAttribute(g) + : null != k ? Df(a, g, k) : Ef(a, g); } switch (c) { case "input": @@ -15543,7 +15482,7 @@ var _example_components2 = _interopRequireDefault(_example_components); - var _hero_example = __webpack_require__(810); + var _hero_example = __webpack_require__(820); var _hero_example2 = _interopRequireDefault(_hero_example); @@ -15793,189 +15732,207 @@ var _locale2 = _interopRequireDefault(_locale); - var _exclude_dates = __webpack_require__(746); + var _locale_without_global_variable = __webpack_require__(746); + + var _locale_without_global_variable2 = _interopRequireDefault( + _locale_without_global_variable + ); + + var _exclude_dates = __webpack_require__(753); var _exclude_dates2 = _interopRequireDefault(_exclude_dates); - var _highlight_dates = __webpack_require__(747); + var _highlight_dates = __webpack_require__(754); var _highlight_dates2 = _interopRequireDefault(_highlight_dates); - var _highlight_dates_with_ranges = __webpack_require__(748); + var _highlight_dates_with_ranges = __webpack_require__(755); var _highlight_dates_with_ranges2 = _interopRequireDefault( _highlight_dates_with_ranges ); - var _include_dates = __webpack_require__(749); + var _include_dates = __webpack_require__(756); var _include_dates2 = _interopRequireDefault(_include_dates); - var _filter_dates = __webpack_require__(750); + var _filter_dates = __webpack_require__(757); var _filter_dates2 = _interopRequireDefault(_filter_dates); - var _disabled = __webpack_require__(751); + var _disabled = __webpack_require__(758); var _disabled2 = _interopRequireDefault(_disabled); - var _disabled_keyboard_navigation = __webpack_require__(752); + var _disabled_keyboard_navigation = __webpack_require__(759); var _disabled_keyboard_navigation2 = _interopRequireDefault( _disabled_keyboard_navigation ); - var _clear_input = __webpack_require__(753); + var _clear_input = __webpack_require__(760); var _clear_input2 = _interopRequireDefault(_clear_input); - var _on_blur_callbacks = __webpack_require__(754); + var _on_blur_callbacks = __webpack_require__(761); var _on_blur_callbacks2 = _interopRequireDefault(_on_blur_callbacks); - var _configurePopper = __webpack_require__(755); + var _configurePopper = __webpack_require__(762); var _configurePopper2 = _interopRequireDefault(_configurePopper); - var _date_range = __webpack_require__(756); + var _date_range = __webpack_require__(763); var _date_range2 = _interopRequireDefault(_date_range); - var _date_range_with_show_disabled_navigation = __webpack_require__(757); + var _date_range_with_show_disabled_navigation = __webpack_require__(764); var _date_range_with_show_disabled_navigation2 = _interopRequireDefault( _date_range_with_show_disabled_navigation ); - var _tab_index = __webpack_require__(758); + var _tab_index = __webpack_require__(765); var _tab_index2 = _interopRequireDefault(_tab_index); - var _year_dropdown = __webpack_require__(759); + var _year_dropdown = __webpack_require__(766); var _year_dropdown2 = _interopRequireDefault(_year_dropdown); - var _month_dropdown = __webpack_require__(760); + var _month_dropdown = __webpack_require__(767); var _month_dropdown2 = _interopRequireDefault(_month_dropdown); - var _month_year_dropdown = __webpack_require__(761); + var _month_year_dropdown = __webpack_require__(768); var _month_year_dropdown2 = _interopRequireDefault(_month_year_dropdown); - var _month_dropdown_short = __webpack_require__(762); + var _month_dropdown_short = __webpack_require__(769); var _month_dropdown_short2 = _interopRequireDefault( _month_dropdown_short ); - var _year_select_dropdown = __webpack_require__(763); + var _year_select_dropdown = __webpack_require__(770); var _year_select_dropdown2 = _interopRequireDefault( _year_select_dropdown ); - var _today = __webpack_require__(764); + var _today = __webpack_require__(771); var _today2 = _interopRequireDefault(_today); - var _inline = __webpack_require__(765); + var _inline = __webpack_require__(772); var _inline2 = _interopRequireDefault(_inline); - var _open_to_date = __webpack_require__(766); + var _open_to_date = __webpack_require__(773); var _open_to_date2 = _interopRequireDefault(_open_to_date); - var _fixed_calendar = __webpack_require__(767); + var _fixed_calendar = __webpack_require__(774); var _fixed_calendar2 = _interopRequireDefault(_fixed_calendar); - var _week_numbers = __webpack_require__(768); + var _week_numbers = __webpack_require__(775); var _week_numbers2 = _interopRequireDefault(_week_numbers); - var _custom_input = __webpack_require__(769); + var _custom_input = __webpack_require__(776); var _custom_input2 = _interopRequireDefault(_custom_input); - var _multi_month = __webpack_require__(770); + var _multi_month = __webpack_require__(777); var _multi_month2 = _interopRequireDefault(_multi_month); - var _multi_month_drp = __webpack_require__(771); + var _multi_month_drp = __webpack_require__(778); var _multi_month_drp2 = _interopRequireDefault(_multi_month_drp); - var _multi_month_inline = __webpack_require__(772); + var _multi_month_inline = __webpack_require__(779); var _multi_month_inline2 = _interopRequireDefault(_multi_month_inline); - var _children = __webpack_require__(773); + var _children = __webpack_require__(780); var _children2 = _interopRequireDefault(_children); - var _calendar_container = __webpack_require__(774); + var _calendar_container = __webpack_require__(781); var _calendar_container2 = _interopRequireDefault(_calendar_container); - var _portal = __webpack_require__(775); + var _portal = __webpack_require__(782); var _portal2 = _interopRequireDefault(_portal); - var _inline_portal = __webpack_require__(776); + var _inline_portal = __webpack_require__(783); var _inline_portal2 = _interopRequireDefault(_inline_portal); - var _raw_change = __webpack_require__(777); + var _raw_change = __webpack_require__(784); var _raw_change2 = _interopRequireDefault(_raw_change); - var _read_only = __webpack_require__(778); + var _read_only = __webpack_require__(785); var _read_only2 = _interopRequireDefault(_read_only); - var _show_time = __webpack_require__(779); + var _show_time = __webpack_require__(786); var _show_time2 = _interopRequireDefault(_show_time); - var _show_time_only = __webpack_require__(780); + var _show_time_only = __webpack_require__(787); var _show_time_only2 = _interopRequireDefault(_show_time_only); - var _exclude_times = __webpack_require__(781); + var _exclude_times = __webpack_require__(788); var _exclude_times2 = _interopRequireDefault(_exclude_times); - var _exclude_time_period = __webpack_require__(782); + var _exclude_time_period = __webpack_require__(789); var _exclude_time_period2 = _interopRequireDefault(_exclude_time_period); - var _include_times = __webpack_require__(783); + var _include_times = __webpack_require__(790); var _include_times2 = _interopRequireDefault(_include_times); - var _inject_times = __webpack_require__(784); + var _inject_times = __webpack_require__(791); var _inject_times2 = _interopRequireDefault(_inject_times); - var _dont_close_onSelect = __webpack_require__(785); + var _dont_close_onSelect = __webpack_require__(792); var _dont_close_onSelect2 = _interopRequireDefault(_dont_close_onSelect); - var _render_custom_header = __webpack_require__(786); + var _render_custom_header = __webpack_require__(793); var _render_custom_header2 = _interopRequireDefault( _render_custom_header ); - var _timeInput = __webpack_require__(807); + var _render_custom_day = __webpack_require__(814); + + var _render_custom_day2 = _interopRequireDefault(_render_custom_day); + + var _timeInput = __webpack_require__(815); var _timeInput2 = _interopRequireDefault(_timeInput); - __webpack_require__(808); + var _strict_parsing = __webpack_require__(816); + + var _strict_parsing2 = _interopRequireDefault(_strict_parsing); + + var _month_picker = __webpack_require__(817); + + var _month_picker2 = _interopRequireDefault(_month_picker); - __webpack_require__(809); + __webpack_require__(818); + + __webpack_require__(819); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; @@ -16148,6 +16105,13 @@ title: "Locale", component: _react2.default.createElement(_locale2.default, null) }, + { + title: "Locale without global variables", + component: _react2.default.createElement( + _locale_without_global_variable2.default, + null + ) + }, { title: "Exclude dates", component: _react2.default.createElement( @@ -16373,12 +16337,33 @@ null ) }, + { + title: "Custom Day", + component: _react2.default.createElement( + _render_custom_day2.default, + null + ) + }, { title: "Input time", component: _react2.default.createElement( _timeInput2.default, null ) + }, + { + title: "Strict parsing", + component: _react2.default.createElement( + _strict_parsing2.default, + null + ) + }, + { + title: "Month Picker", + component: _react2.default.createElement( + _month_picker2.default, + null + ) } ]), (_this.renderExamples = function() { @@ -21923,8 +21908,7 @@ }, /* 385 */ /***/ function(module, exports) { - module.exports - /** + module.exports /** * Known issues: * * - invalid hex string literals will be recognized as a double quoted strings @@ -25711,8 +25695,7 @@ }, /* 419 */ /***/ 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: [ @@ -34169,8 +34152,8 @@ lexemes: /[a-z0-9_<>-]+/, keywords: { /* block match pass are "actions" in pf.conf(5), the rest are - * lexically similar top-level commands. - */ + * lexically similar top-level commands. + */ built_in: "block match pass load anchor|5 antispoof|10 set table", keyword: "in out log quick on rdomain inet inet6 proto from port os to route" + @@ -35466,8 +35449,7 @@ }, /* 482 */ /***/ 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", @@ -39451,7 +39433,7 @@ }, { /* this is for cases like CNT100 where the default lexemes do not - * separate the keyword and the number */ + * separate the keyword and the number */ className: "keyword", begin: "\\b(ACC|CNT|Skip|Offset|PSPD|RT_LD|AP_LD|Tool_Offset)" }, @@ -40909,6 +40891,8 @@ shouldCloseOnSelect: true, showTimeSelect: false, showTimeInput: false, + showMonthYearPicker: false, + strictParsing: false, timeIntervals: 30, timeCaption: "Time", previousMonthButtonLabel: "Previous Month", @@ -40936,10 +40920,10 @@ return _this.props.openToDate ? _this.props.openToDate : _this.props.selectsEnd && _this.props.startDate - ? _this.props.startDate - : _this.props.selectsStart && _this.props.endDate - ? _this.props.endDate - : (0, _date_utils.newDate)(); + ? _this.props.startDate + : _this.props.selectsStart && _this.props.endDate + ? _this.props.endDate + : (0, _date_utils.newDate)(); }; _this.calcInitialState = function() { @@ -40951,8 +40935,8 @@ ? minDate : maxDate && (0, _date_utils.isAfter)(defaultPreSelection, maxDate) - ? maxDate - : defaultPreSelection; + ? maxDate + : defaultPreSelection; return { open: _this.props.startOpen || false, preventFocus: false, @@ -41109,7 +41093,8 @@ var date = (0, _date_utils.parseDate)( event.target.value, _this.props.dateFormat, - _this.props.locale + _this.props.locale, + _this.props.strictParsing ); if (date || !event.target.value) { _this.setSelected(date, event, true); @@ -41419,7 +41404,10 @@ renderCustomHeader: _this.props.renderCustomHeader, popperProps: _this.props.popperProps, renderDayContents: _this.props.renderDayContents, - showTimeInput: _this.props.showTimeInput + onDayMouseEnter: _this.props.onDayMouseEnter, + onMonthMouseLeave: _this.props.onMonthMouseLeave, + showTimeInput: _this.props.showTimeInput, + showMonthYearPicker: _this.props.showMonthYearPicker }, _this.props.children ); @@ -41443,11 +41431,11 @@ typeof _this.props.value === "string" ? _this.props.value : typeof _this.state.inputValue === "string" - ? _this.state.inputValue - : (0, _date_utils.safeDateFormat)( - _this.props.selected, - _this.props - ); + ? _this.state.inputValue + : (0, _date_utils.safeDateFormat)( + _this.props.selected, + _this.props + ); return _react2.default.cloneElement( customInput, @@ -41612,7 +41600,10 @@ injectTimes: _propTypes2.default.array, inline: _propTypes2.default.bool, isClearable: _propTypes2.default.bool, - locale: _propTypes2.default.string, + locale: _propTypes2.default.oneOfType([ + _propTypes2.default.string, + _propTypes2.default.shape({ locale: _propTypes2.default.object }) + ]), maxDate: _propTypes2.default.instanceOf(Date), minDate: _propTypes2.default.instanceOf(Date), monthsShown: _propTypes2.default.number, @@ -41652,6 +41643,7 @@ showMonthYearDropdown: _propTypes2.default.bool, showWeekNumbers: _propTypes2.default.bool, showYearDropdown: _propTypes2.default.bool, + strictParsing: _propTypes2.default.bool, forceShowMonthNavigation: _propTypes2.default.bool, showDisabledMonthNavigation: _propTypes2.default.bool, startDate: _propTypes2.default.instanceOf(Date), @@ -41668,6 +41660,7 @@ yearDropdownItemNumber: _propTypes2.default.number, shouldCloseOnSelect: _propTypes2.default.bool, showTimeInput: _propTypes2.default.bool, + showMonthYearPicker: _propTypes2.default.bool, showTimeSelect: _propTypes2.default.bool, showTimeSelectOnly: _propTypes2.default.bool, timeFormat: _propTypes2.default.string, @@ -41682,7 +41675,9 @@ timeInputLabel: _propTypes2.default.string, renderCustomHeader: _propTypes2.default.func, renderDayContents: _propTypes2.default.func, - inlineFocusSelectedMonth: _propTypes2.default.bool + inlineFocusSelectedMonth: _propTypes2.default.bool, + onDayMouseEnter: _propTypes2.default.func, + onMonthMouseLeave: _propTypes2.default.func }; exports.default = DatePicker; @@ -41751,9 +41746,9 @@ /***/ }, /* 534 */ - [856, 535], + [866, 535], /* 535 */ - [857, 331, 536, 537], + [867, 331, 536, 537], /* 536 */ /***/ function(module, exports, __webpack_require__) { /** @@ -41986,6 +41981,8 @@ monthSelectedIn: 0, forceShowMonthNavigation: false, timeCaption: "Time", + previousYearButtonLabel: "Previous Year", + nextYearButtonLabel: "Next Year", previousMonthButtonLabel: "Previous Month", nextMonthButtonLabel: "Next Month" }; @@ -42063,11 +42060,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) { @@ -42180,7 +42179,18 @@ : (0, _date_utils.getWeekdayMinInLocale)(day, locale); }; - _this.renderPreviousMonthButton = function() { + _this.decreaseYear = function() { + _this.setState( + { + date: (0, _date_utils.subYears)(_this.state.date, 1) + }, + function() { + return _this.handleYearChange(_this.state.date); + } + ); + }; + + _this.renderPreviousButton = function() { if (_this.props.renderCustomHeader) { return; } @@ -42206,6 +42216,10 @@ var clickHandler = _this.decreaseMonth; + if (_this.props.showMonthYearPicker) { + clickHandler = _this.decreaseYear; + } + if ( allPrevDaysDisabled && _this.props.showDisabledMonthNavigation @@ -42221,11 +42235,24 @@ className: classes.join(" "), onClick: clickHandler }, - _this.props.previousMonthButtonLabel + _this.props.showMonthYearPicker + ? _this.props.previousYearButtonLabel + : _this.props.previousMonthButtonLabel ); }; - _this.renderNextMonthButton = function() { + _this.increaseYear = function() { + _this.setState( + { + date: (0, _date_utils.addYears)(_this.state.date, 1) + }, + function() { + return _this.handleYearChange(_this.state.date); + } + ); + }; + + _this.renderNextButton = function() { if (_this.props.renderCustomHeader) { return; } @@ -42259,6 +42286,10 @@ var clickHandler = _this.increaseMonth; + if (_this.props.showMonthYearPicker) { + clickHandler = _this.increaseYear; + } + if ( allNextDaysDisabled && _this.props.showDisabledMonthNavigation @@ -42274,7 +42305,9 @@ className: classes.join(" "), onClick: clickHandler }, - _this.props.nextMonthButtonLabel + _this.props.showMonthYearPicker + ? _this.props.nextYearButtonLabel + : _this.props.nextMonthButtonLabel ); }; @@ -42464,6 +42497,17 @@ ); }; + _this.renderYearHeader = function() { + return _react2.default.createElement( + "div", + { + className: + "react-datepicker__header react-datepicker-year-header" + }, + (0, _date_utils.getYear)(_this.state.date) + ); + }; + _this.renderMonths = function() { if (_this.props.showTimeSelectOnly) { return; @@ -42487,10 +42531,16 @@ }, className: "react-datepicker__month-container" }, - _this.props.renderCustomHeader - ? _this.renderCustomHeader({ monthDate: monthDate, i: i }) - : _this.renderDefaultHeader({ monthDate: monthDate, i: i }), + !_this.props.showMonthYearPicker + ? _this.props.renderCustomHeader + ? _this.renderCustomHeader({ monthDate: monthDate, i: i }) + : _this.renderDefaultHeader({ + monthDate: monthDate, + i: i + }) + : _this.renderYearHeader({ monthDate: monthDate, i: i }), _react2.default.createElement(_month2.default, { + onChange: _this.changeMonthYear, day: monthDate, dayClassName: _this.props.dayClassName, onDayClick: _this.handleDayClick, @@ -42521,7 +42571,8 @@ shouldCloseOnSelect: _this.props.shouldCloseOnSelect, renderDayContents: _this.props.renderDayContents, disabledKeyboardNavigation: - _this.props.disabledKeyboardNavigation + _this.props.disabledKeyboardNavigation, + showMonthYearPicker: _this.props.showMonthYearPicker }) ) ); @@ -42631,8 +42682,8 @@ } ) }, - this.renderPreviousMonthButton(), - this.renderNextMonthButton(), + this.renderPreviousButton(), + this.renderNextButton(), this.renderMonths(), this.renderTodayButton(), this.renderTimeSection(), @@ -42666,7 +42717,10 @@ includeTimes: _propTypes2.default.array, injectTimes: _propTypes2.default.array, inline: _propTypes2.default.bool, - locale: _propTypes2.default.string, + locale: _propTypes2.default.oneOfType([ + _propTypes2.default.string, + _propTypes2.default.shape({ locale: _propTypes2.default.object }) + ]), maxDate: _propTypes2.default.instanceOf(Date), minDate: _propTypes2.default.instanceOf(Date), monthsShown: _propTypes2.default.number, @@ -42680,6 +42734,7 @@ onWeekSelect: _propTypes2.default.func, showTimeSelect: _propTypes2.default.bool, showTimeInput: _propTypes2.default.bool, + showMonthYearPicker: _propTypes2.default.bool, showTimeSelectOnly: _propTypes2.default.bool, timeFormat: _propTypes2.default.string, timeIntervals: _propTypes2.default.number, @@ -42714,8 +42769,12 @@ showDisabledMonthNavigation: _propTypes2.default.bool, previousMonthButtonLabel: _propTypes2.default.string, nextMonthButtonLabel: _propTypes2.default.string, + previousYearButtonLabel: _propTypes2.default.string, + nextYearButtonLabel: _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; @@ -43560,9 +43619,10 @@ return isValid(d) ? d : null; } - function parseDate(value, dateFormat, locale) { + function parseDate(value, dateFormat, locale, strictParsing) { var parsedDate = null; var localeObject = getLocaleObject(locale); + var strictParsingValueMatch = true; if (Array.isArray(dateFormat)) { dateFormat.forEach(function(df) { var tryParseDate = (0, _parse2.default)( @@ -43571,22 +43631,42 @@ new Date(), localeObject ); - if (isValid(tryParseDate)) { + if (strictParsing) { + strictParsingValueMatch = + isValid(tryParseDate) && + value === + (0, _format2.default)(tryParseDate, df, { + awareOfUnicodeTokens: true + }); + } + if (isValid(tryParseDate) && strictParsingValueMatch) { parsedDate = tryParseDate; } }); return parsedDate; } + parsedDate = (0, _parse2.default)( value, dateFormat, new Date(), localeObject ); - if (!isValid(parsedDate)) { + + if (strictParsing) { + strictParsingValueMatch = + isValid(parsedDate) && + value === + (0, _format2.default)(parsedDate, dateFormat, { + awareOfUnicodeTokens: true + }); + } else if (!isValid(parsedDate)) { parsedDate = new Date(value); } - return isValid(parsedDate) ? parsedDate : null; + + return isValid(parsedDate) && strictParsingValueMatch + ? parsedDate + : null; } // ** Date "Reflection" ** @@ -43809,8 +43889,16 @@ return window.__localeId__; } - function getLocaleObject(localeName) { - return window.__localeData__ ? window.__localeData__[localeName] : null; + function getLocaleObject(localeSpec) { + if (typeof localeSpec === "string") { + // Treat it as a locale name registered by registerLocale + return window.__localeData__ + ? window.__localeData__[localeSpec] + : null; + } else { + // Treat it as a raw date-fns locale object + return localeSpec; + } } function getFormattedWeekdayInLocale(date, formatFunc, locale) { @@ -46192,50 +46280,50 @@ }; /* - * | | Unit | | Unit | - * |-----|--------------------------------|-----|--------------------------------| - * | a | AM, PM | A* | Milliseconds in day | - * | b | AM, PM, noon, midnight | B | Flexible day period | - * | c | Stand-alone local day of week | C* | Localized hour w/ day period | - * | d | Day of month | D | Day of year | - * | e | Local day of week | E | Day of week | - * | f | | F* | Day of week in month | - * | g* | Modified Julian day | G | Era | - * | h | Hour [1-12] | H | Hour [0-23] | - * | i! | ISO day of week | I! | ISO week of year | - * | j* | Localized hour w/ day period | J* | Localized hour w/o day period | - * | k | Hour [1-24] | K | Hour [0-11] | - * | l* | (deprecated) | L | Stand-alone month | - * | m | Minute | M | Month | - * | n | | N | | - * | o! | Ordinal number modifier | O | Timezone (GMT) | - * | p! | Long localized time | P! | Long localized date | - * | q | Stand-alone quarter | Q | Quarter | - * | r* | Related Gregorian year | R! | ISO week-numbering year | - * | s | Second | S | Fraction of second | - * | t! | Seconds timestamp | T! | Milliseconds timestamp | - * | u | Extended year | U* | Cyclic year | - * | v* | Timezone (generic non-locat.) | V* | Timezone (location) | - * | w | Local week of year | W* | Week of month | - * | x | Timezone (ISO-8601 w/o Z) | X | Timezone (ISO-8601) | - * | y | Year (abs) | Y | Local week-numbering year | - * | z | Timezone (specific non-locat.) | Z* | Timezone (aliases) | - * - * Letters marked by * are not implemented but reserved by Unicode standard. - * - * Letters marked by ! are non-standard, but implemented by date-fns: - * - `o` modifies the previous token to turn it into an ordinal (see `format` docs) - * - `i` is ISO day of week. For `i` and `ii` is returns numeric ISO week days, - * i.e. 7 for Sunday, 1 for Monday, etc. - * - `I` is ISO week of year, as opposed to `w` which is local week of year. - * - `R` is ISO week-numbering year, as opposed to `Y` which is local week-numbering year. - * `R` is supposed to be used in conjunction with `I` and `i` - * for universal ISO week-numbering date, whereas - * `Y` is supposed to be used in conjunction with `w` and `e` - * for week-numbering date specific to the locale. - * - `P` is long localized date format - * - `p` is long localized time format - */ + * | | Unit | | Unit | + * |-----|--------------------------------|-----|--------------------------------| + * | a | AM, PM | A* | Milliseconds in day | + * | b | AM, PM, noon, midnight | B | Flexible day period | + * | c | Stand-alone local day of week | C* | Localized hour w/ day period | + * | d | Day of month | D | Day of year | + * | e | Local day of week | E | Day of week | + * | f | | F* | Day of week in month | + * | g* | Modified Julian day | G | Era | + * | h | Hour [1-12] | H | Hour [0-23] | + * | i! | ISO day of week | I! | ISO week of year | + * | j* | Localized hour w/ day period | J* | Localized hour w/o day period | + * | k | Hour [1-24] | K | Hour [0-11] | + * | l* | (deprecated) | L | Stand-alone month | + * | m | Minute | M | Month | + * | n | | N | | + * | o! | Ordinal number modifier | O | Timezone (GMT) | + * | p! | Long localized time | P! | Long localized date | + * | q | Stand-alone quarter | Q | Quarter | + * | r* | Related Gregorian year | R! | ISO week-numbering year | + * | s | Second | S | Fraction of second | + * | t! | Seconds timestamp | T! | Milliseconds timestamp | + * | u | Extended year | U* | Cyclic year | + * | v* | Timezone (generic non-locat.) | V* | Timezone (location) | + * | w | Local week of year | W* | Week of month | + * | x | Timezone (ISO-8601 w/o Z) | X | Timezone (ISO-8601) | + * | y | Year (abs) | Y | Local week-numbering year | + * | z | Timezone (specific non-locat.) | Z* | Timezone (aliases) | + * + * Letters marked by * are not implemented but reserved by Unicode standard. + * + * Letters marked by ! are non-standard, but implemented by date-fns: + * - `o` modifies the previous token to turn it into an ordinal (see `format` docs) + * - `i` is ISO day of week. For `i` and `ii` is returns numeric ISO week days, + * i.e. 7 for Sunday, 1 for Monday, etc. + * - `I` is ISO week of year, as opposed to `w` which is local week of year. + * - `R` is ISO week-numbering year, as opposed to `Y` which is local week-numbering year. + * `R` is supposed to be used in conjunction with `I` and `i` + * for universal ISO week-numbering date, whereas + * `Y` is supposed to be used in conjunction with `w` and `e` + * for week-numbering date specific to the locale. + * - `P` is long localized date format + * - `p` is long localized time format + */ var formatters = { // Era @@ -51383,48 +51471,48 @@ } /* - * | | Unit | | Unit | - * |-----|--------------------------------|-----|--------------------------------| - * | a | AM, PM | A* | Milliseconds in day | - * | b | AM, PM, noon, midnight | B | Flexible day period | - * | c | Stand-alone local day of week | C* | Localized hour w/ day period | - * | d | Day of month | D | Day of year | - * | e | Local day of week | E | Day of week | - * | f | | F* | Day of week in month | - * | g* | Modified Julian day | G | Era | - * | h | Hour [1-12] | H | Hour [0-23] | - * | i! | ISO day of week | I! | ISO week of year | - * | j* | Localized hour w/ day period | J* | Localized hour w/o day period | - * | k | Hour [1-24] | K | Hour [0-11] | - * | l* | (deprecated) | L | Stand-alone month | - * | m | Minute | M | Month | - * | n | | N | | - * | o! | Ordinal number modifier | O* | Timezone (GMT) | - * | p | | P | | - * | q | Stand-alone quarter | Q | Quarter | - * | r* | Related Gregorian year | R! | ISO week-numbering year | - * | s | Second | S | Fraction of second | - * | t! | Seconds timestamp | T! | Milliseconds timestamp | - * | u | Extended year | U* | Cyclic year | - * | v* | Timezone (generic non-locat.) | V* | Timezone (location) | - * | w | Local week of year | W* | Week of month | - * | x | Timezone (ISO-8601 w/o Z) | X | Timezone (ISO-8601) | - * | y | Year (abs) | Y | Local week-numbering year | - * | z* | Timezone (specific non-locat.) | Z* | Timezone (aliases) | - * - * Letters marked by * are not implemented but reserved by Unicode standard. - * - * Letters marked by ! are non-standard, but implemented by date-fns: - * - `o` modifies the previous token to turn it into an ordinal (see `parse` docs) - * - `i` is ISO day of week. For `i` and `ii` is returns numeric ISO week days, - * i.e. 7 for Sunday, 1 for Monday, etc. - * - `I` is ISO week of year, as opposed to `w` which is local week of year. - * - `R` is ISO week-numbering year, as opposed to `Y` which is local week-numbering year. - * `R` is supposed to be used in conjunction with `I` and `i` - * for universal ISO week-numbering date, whereas - * `Y` is supposed to be used in conjunction with `w` and `e` - * for week-numbering date specific to the locale. - */ + * | | Unit | | Unit | + * |-----|--------------------------------|-----|--------------------------------| + * | a | AM, PM | A* | Milliseconds in day | + * | b | AM, PM, noon, midnight | B | Flexible day period | + * | c | Stand-alone local day of week | C* | Localized hour w/ day period | + * | d | Day of month | D | Day of year | + * | e | Local day of week | E | Day of week | + * | f | | F* | Day of week in month | + * | g* | Modified Julian day | G | Era | + * | h | Hour [1-12] | H | Hour [0-23] | + * | i! | ISO day of week | I! | ISO week of year | + * | j* | Localized hour w/ day period | J* | Localized hour w/o day period | + * | k | Hour [1-24] | K | Hour [0-11] | + * | l* | (deprecated) | L | Stand-alone month | + * | m | Minute | M | Month | + * | n | | N | | + * | o! | Ordinal number modifier | O* | Timezone (GMT) | + * | p | | P | | + * | q | Stand-alone quarter | Q | Quarter | + * | r* | Related Gregorian year | R! | ISO week-numbering year | + * | s | Second | S | Fraction of second | + * | t! | Seconds timestamp | T! | Milliseconds timestamp | + * | u | Extended year | U* | Cyclic year | + * | v* | Timezone (generic non-locat.) | V* | Timezone (location) | + * | w | Local week of year | W* | Week of month | + * | x | Timezone (ISO-8601 w/o Z) | X | Timezone (ISO-8601) | + * | y | Year (abs) | Y | Local week-numbering year | + * | z* | Timezone (specific non-locat.) | Z* | Timezone (aliases) | + * + * Letters marked by * are not implemented but reserved by Unicode standard. + * + * Letters marked by ! are non-standard, but implemented by date-fns: + * - `o` modifies the previous token to turn it into an ordinal (see `parse` docs) + * - `i` is ISO day of week. For `i` and `ii` is returns numeric ISO week days, + * i.e. 7 for Sunday, 1 for Monday, etc. + * - `I` is ISO week of year, as opposed to `w` which is local week of year. + * - `R` is ISO week-numbering year, as opposed to `Y` which is local week-numbering year. + * `R` is supposed to be used in conjunction with `I` and `i` + * for universal ISO week-numbering date, whereas + * `Y` is supposed to be used in conjunction with `w` and `e` + * for week-numbering date specific to the locale. + */ var parsers = { // Era G: { @@ -52040,7 +52128,7 @@ parse: function parse(string, token, match, options) { var valueCallback = function valueCallback(value) { var wholeWeekDays = Math.floor((value - 1) / 7) * 7; - return ((value + options.weekStartsOn + 6) % 7) + wholeWeekDays; + return (value + options.weekStartsOn + 6) % 7 + wholeWeekDays; }; switch (token) { @@ -52116,7 +52204,7 @@ parse: function parse(string, token, match, options) { var valueCallback = function valueCallback(value) { var wholeWeekDays = Math.floor((value - 1) / 7) * 7; - return ((value + options.weekStartsOn + 6) % 7) + wholeWeekDays; + return (value + options.weekStartsOn + 6) % 7 + wholeWeekDays; }; switch (token) { @@ -54295,16 +54383,51 @@ return weeks; }), + (_this.onMonthClick = function(e, m) { + _this.handleDayClick( + utils.getStartOfMonth(utils.setMonth(_this.props.day, m), e) + ); + }), + (_this.renderMonths = function() { + var months = [[0, 1, 2], [3, 4, 5], [6, 7, 8], [9, 10, 11]]; + return months.map(function(month, i) { + return _react2.default.createElement( + "div", + { className: "react-datepicker__month-wrapper", key: i }, + month.map(function(m, j) { + return _react2.default.createElement( + "div", + { + key: j, + onClick: function onClick(ev) { + _this.onMonthClick(ev.target, m); + }, + className: (0, _classnames2.default)( + "react-datepicker__month-text", + "react-datepicker__month-" + m + ) + }, + utils.getMonthShortInLocale(m, _this.props.locale) + ); + }) + ); + }); + }), (_this.getClassNames = function() { var _this$props = _this.props, selectingDate = _this$props.selectingDate, selectsStart = _this$props.selectsStart, - selectsEnd = _this$props.selectsEnd; + selectsEnd = _this$props.selectsEnd, + showMonthYearPicker = _this$props.showMonthYearPicker; - return (0, _classnames2.default)("react-datepicker__month", { - "react-datepicker__month--selecting-range": - selectingDate && (selectsStart || selectsEnd) - }); + return (0, _classnames2.default)( + "react-datepicker__month", + { + "react-datepicker__month--selecting-range": + selectingDate && (selectsStart || selectsEnd) + }, + { "react-datepicker__monthPicker": showMonthYearPicker } + ); }), _temp)), _possibleConstructorReturn(_this, _ret) @@ -54312,6 +54435,8 @@ } Month.prototype.render = function render() { + var showMonthYearPicker = this.props.showMonthYearPicker; + return _react2.default.createElement( "div", { @@ -54321,7 +54446,7 @@ "aria-label": "month-" + utils.formatDate(this.props.day, "YYYY-MM") }, - this.renderWeeks() + showMonthYearPicker ? this.renderMonths() : this.renderWeeks() ); }; @@ -54341,7 +54466,10 @@ highlightDates: _propTypes2.default.instanceOf(Map), includeDates: _propTypes2.default.array, inline: _propTypes2.default.bool, - locale: _propTypes2.default.string, + locale: _propTypes2.default.oneOfType([ + _propTypes2.default.string, + _propTypes2.default.shape({ locale: _propTypes2.default.object }) + ]), maxDate: _propTypes2.default.instanceOf(Date), minDate: _propTypes2.default.instanceOf(Date), onDayClick: _propTypes2.default.func, @@ -54358,7 +54486,8 @@ startDate: _propTypes2.default.instanceOf(Date), setOpen: _propTypes2.default.func, shouldCloseOnSelect: _propTypes2.default.bool, - renderDayContents: _propTypes2.default.func + renderDayContents: _propTypes2.default.func, + showMonthYearPicker: _propTypes2.default.bool }; exports.default = Month; @@ -54599,7 +54728,10 @@ highlightDates: _propTypes2.default.instanceOf(Map), includeDates: _propTypes2.default.array, inline: _propTypes2.default.bool, - locale: _propTypes2.default.string, + locale: _propTypes2.default.oneOfType([ + _propTypes2.default.string, + _propTypes2.default.shape({ locale: _propTypes2.default.object }) + ]), maxDate: _propTypes2.default.instanceOf(Date), minDate: _propTypes2.default.instanceOf(Date), month: _propTypes2.default.number, @@ -54914,7 +55046,8 @@ }, this.props.renderDayContents ? this.props.renderDayContents( - (0, _date_utils.getDate)(this.props.day) + (0, _date_utils.getDate)(this.props.day), + this.props.day ) : (0, _date_utils.getDate)(this.props.day) ); @@ -56085,7 +56218,7 @@ /***/ }, /* 642 */ - [845, 643, 658], + [855, 643, 658], /* 643 */ /***/ function(module, exports, __webpack_require__) { var global = __webpack_require__(644); @@ -56105,9 +56238,7 @@ var expProto = exports[PROTOTYPE]; var target = IS_GLOBAL ? global - : IS_STATIC - ? global[name] - : (global[name] || {})[PROTOTYPE]; + : IS_STATIC ? global[name] : (global[name] || {})[PROTOTYPE]; var key, own, out; if (IS_GLOBAL) source = name; for (key in source) { @@ -56121,32 +56252,32 @@ IS_GLOBAL && typeof target[key] != "function" ? source[key] : // bind timers to global for call from export context - IS_BIND && own - ? ctx(out, global) - : // wrap global constructors for prevent change them in library - IS_WRAP && target[key] == out - ? (function(C) { - var F = function(a, b, c) { - if (this instanceof C) { - switch (arguments.length) { - case 0: - return new C(); - case 1: - return new C(a); - case 2: - return new C(a, b); - } - return new C(a, b, c); - } - return C.apply(this, arguments); - }; - F[PROTOTYPE] = C[PROTOTYPE]; - return F; - // make static versions for prototype methods - })(out) - : IS_PROTO && typeof out == "function" - ? ctx(Function.call, out) - : out; + IS_BIND && own + ? ctx(out, global) + : // wrap global constructors for prevent change them in library + IS_WRAP && target[key] == out + ? (function(C) { + var F = function(a, b, c) { + if (this instanceof C) { + switch (arguments.length) { + case 0: + return new C(); + case 1: + return new C(a); + case 2: + return new C(a, b); + } + return new C(a, b, c); + } + return C.apply(this, arguments); + }; + F[PROTOTYPE] = C[PROTOTYPE]; + return F; + // make static versions for prototype methods + })(out) + : IS_PROTO && typeof out == "function" + ? ctx(Function.call, out) + : out; // export proto methods to core.%CONSTRUCTOR%.methods.%NAME% if (IS_PROTO) { (exports.virtual || (exports.virtual = {}))[key] = out; @@ -56174,57 +56305,57 @@ /* 645 */ 9, /* 646 */ - [819, 647], + [829, 647], /* 647 */ 21, /* 648 */ - [813, 649, 657, 653], + [823, 649, 657, 653], /* 649 */ - [814, 650, 652, 656, 653], + [824, 650, 652, 656, 653], /* 650 */ - [815, 651], + [825, 651], /* 651 */ 13, /* 652 */ - [816, 653, 654, 655], + [826, 653, 654, 655], /* 653 */ - [812, 654], + [822, 654], /* 654 */ 7, /* 655 */ - [817, 651, 644], + [827, 651, 644], /* 656 */ - [818, 651], + [828, 651], /* 657 */ 17, /* 658 */ - [846, 659, 674, 675, 676, 663, 654], + [856, 659, 674, 675, 676, 663, 654], /* 659 */ - [827, 660, 673], + [837, 660, 673], /* 660 */ - [828, 661, 662, 666, 670], + [838, 661, 662, 666, 670], /* 661 */ 5, /* 662 */ - [829, 663, 665], + [839, 663, 665], /* 663 */ - [830, 664], + [840, 664], /* 664 */ 34, /* 665 */ 35, /* 666 */ - [831, 662, 667, 669], + [841, 662, 667, 669], /* 667 */ - [832, 668], + [842, 668], /* 668 */ 38, /* 669 */ - [833, 668], + [843, 668], /* 670 */ - [834, 671, 672], + [844, 671, 672], /* 671 */ - [821, 644], + [831, 644], /* 672 */ 19, /* 673 */ @@ -56234,7 +56365,7 @@ /* 675 */ 43, /* 676 */ - [843, 665], + [853, 665], /* 677 */ /***/ function(module, exports) { "use strict"; @@ -56326,9 +56457,7 @@ obj.constructor === _symbol2.default && obj !== _symbol2.default.prototype ? "symbol" - : typeof obj === "undefined" - ? "undefined" - : _typeof(obj); + : typeof obj === "undefined" ? "undefined" : _typeof(obj); }; /***/ @@ -56348,11 +56477,11 @@ /***/ }, /* 682 */ - [849, 683, 684], + [859, 683, 684], /* 683 */ - [850, 668, 665], + [860, 668, 665], /* 684 */ - [851, 685, 643, 686, 648, 661, 687, 688, 692, 694, 693], + [861, 685, 643, 686, 648, 661, 687, 688, 692, 694, 693], /* 685 */ /***/ function(module, exports) { module.exports = true; @@ -56368,19 +56497,19 @@ /* 687 */ 129, /* 688 */ - [852, 689, 657, 692, 648, 693], + [862, 689, 657, 692, 648, 693], /* 689 */ - [836, 650, 690, 673, 670, 655, 691], + [846, 650, 690, 673, 670, 655, 691], /* 690 */ - [837, 649, 650, 659, 653], + [847, 649, 650, 659, 653], /* 691 */ - [838, 644], + [848, 644], /* 692 */ - [822, 649, 661, 693], + [832, 649, 661, 693], /* 693 */ - [823, 671, 672, 644], + [833, 671, 672, 644], /* 694 */ - [844, 661, 676, 670], + [854, 661, 676, 670], /* 695 */ /***/ function(module, exports, __webpack_require__) { __webpack_require__(696); @@ -56408,7 +56537,7 @@ /***/ }, /* 696 */ - [853, 697, 698, 687, 662, 684], + [863, 697, 698, 687, 662, 684], /* 697 */ /***/ function(module, exports) { module.exports = function() { @@ -56420,7 +56549,7 @@ /* 698 */ 195, /* 699 */ - [824, 693], + [834, 693], /* 700 */ /***/ function(module, exports, __webpack_require__) { module.exports = { default: __webpack_require__(701), __esModule: true }; @@ -56439,7 +56568,7 @@ }, /* 702 */ [ - 811, + 821, 644, 661, 653, @@ -56471,27 +56600,27 @@ 648 ], /* 703 */ - [820, 672, 651, 661, 649, 654], + [830, 672, 651, 661, 649, 654], /* 704 */ - [825, 644, 645, 685, 699, 649], + [835, 644, 645, 685, 699, 649], /* 705 */ - [826, 659, 674, 675], + [836, 659, 674, 675], /* 706 */ - [835, 664], + [845, 664], /* 707 */ - [839, 662, 708], + [849, 662, 708], /* 708 */ - [840, 660, 673], + [850, 660, 673], /* 709 */ - [841, 675, 657, 662, 656, 661, 652, 653], + [851, 675, 657, 662, 656, 661, 652, 653], /* 710 */ /***/ function(module, exports) { /***/ }, /* 711 */ - [854, 704], + [864, 704], /* 712 */ - [855, 704], + [865, 704], /* 713 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -56557,9 +56686,9 @@ /***/ }, /* 716 */ - [847, 643, 717], + [857, 643, 717], /* 717 */ - [848, 651, 650, 646, 709], + [858, 651, 650, 646, 709], /* 718 */ /***/ function(module, exports, __webpack_require__) { module.exports = { default: __webpack_require__(719), __esModule: true }; @@ -56577,7 +56706,7 @@ /***/ }, /* 720 */ - [842, 643, 689], + [852, 643, 689], /* 721 */ /***/ function(module, exports, __webpack_require__) { /* WEBPACK VAR INJECTION */ (function(global) { @@ -56609,8 +56738,8 @@ true ? (module.exports = factory()) : typeof define === "function" && define.amd - ? define(factory) - : (global.Popper = factory()); + ? define(factory) + : (global.Popper = factory()); })(this, function() { "use strict"; @@ -56947,14 +57076,14 @@ } /* - * Sum or subtract the element scroll values (left and top) from a given rect object - * @method - * @memberof Popper.Utils - * @param {Object} rect - Rect object you want to change - * @param {HTMLElement} element - The element from the function reads the scroll values - * @param {Boolean} subtract - set to true if you want to subtract the scroll values - * @return {Object} rect - The modifier rect object - */ + * Sum or subtract the element scroll values (left and top) from a given rect object + * @method + * @memberof Popper.Utils + * @param {Object} rect - Rect object you want to change + * @param {HTMLElement} element - The element from the function reads the scroll values + * @param {Boolean} subtract - set to true if you want to subtract the scroll values + * @return {Object} rect - The modifier rect object + */ function includeScroll(rect, element) { var subtract = arguments.length > 2 && arguments[2] !== undefined @@ -56972,14 +57101,14 @@ } /* - * Helper to detect borders of a given element - * @method - * @memberof Popper.Utils - * @param {CSSStyleDeclaration} styles - * Result of `getStyleComputedProperty` on the given element - * @param {String} axis - `x` or `y` - * @return {number} borders - The borders size of the given axis - */ + * Helper to detect borders of a given element + * @method + * @memberof Popper.Utils + * @param {CSSStyleDeclaration} styles + * Result of `getStyleComputedProperty` on the given element + * @param {String} axis - `x` or `y` + * @return {number} borders - The borders size of the given axis + */ function getBordersSize(styles, axis) { var sideA = axis === "x" ? "Left" : "Top"; @@ -57000,12 +57129,12 @@ html["scroll" + axis], isIE(10) ? html["offset" + axis] + - computedStyle[ - "margin" + (axis === "Height" ? "Top" : "Left") - ] + - computedStyle[ - "margin" + (axis === "Height" ? "Bottom" : "Right") - ] + computedStyle[ + "margin" + (axis === "Height" ? "Top" : "Left") + ] + + computedStyle[ + "margin" + (axis === "Height" ? "Bottom" : "Right") + ] : 0 ); } @@ -58577,7 +58706,7 @@ } var rect = getClientRect(element); - return (rect[measurement] / 100) * value; + return rect[measurement] / 100 * value; } else if (unit === "vh" || unit === "vw") { // if is a vh or vw, we calculate the size based on the viewport var size = void 0; @@ -58592,7 +58721,7 @@ window.innerWidth || 0 ); } - return (size / 100) * value; + return size / 100 * value; } else { // if is an explicit pixel unit, we get rid of the unit and keep the value // if is an implicit unit, it's px, and we return just the value @@ -58662,14 +58791,11 @@ // Convert the values with units to absolute pixels to allow our computations ops = ops.map(function(op, index) { // Most of the units rely on the orientation of the popper - var measurement = (index === 1 - ? !useHeight - : useHeight) + var measurement = (index === 1 ? !useHeight : useHeight) ? "height" : "width"; var mergeWithPrevious = false; - return ( - op + return (op // This aggregates any `+` or `-` sign that aren't considered operators // e.g.: 10 + +5 => [10, +, +5] .reduce(function(a, b) { @@ -58696,8 +58822,7 @@ popperOffsets, referenceOffsets ); - }) - ); + }) ); }); // Loop trough the offsets arrays and execute the operations @@ -59976,9 +60101,9 @@ /***/ }, /* 725 */ - [856, 726], + [866, 726], /* 726 */ - [857, 727, 728, 729], + [867, 727, 728, 729], /* 727 */ 331, /* 728 */ @@ -61182,6 +61307,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);", @@ -61352,6 +61485,616 @@ var _reactDatepicker2 = _interopRequireDefault(_reactDatepicker); + var _fi = __webpack_require__(747); + + var _fi2 = _interopRequireDefault(_fi); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { default: obj }; + } + + function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError("Cannot call a class as a function"); + } + } + + function _possibleConstructorReturn(self, call) { + if (!self) { + throw new ReferenceError( + "this hasn't been initialised - super() hasn't been called" + ); + } + return call && (typeof call === "object" || typeof call === "function") + ? call + : self; + } + + function _inherits(subClass, superClass) { + if (typeof superClass !== "function" && superClass !== null) { + throw new TypeError( + "Super expression must either be null or a function, not " + + typeof superClass + ); + } + subClass.prototype = Object.create(superClass && superClass.prototype, { + constructor: { + value: subClass, + enumerable: false, + writable: true, + configurable: true + } + }); + if (superClass) + Object.setPrototypeOf + ? Object.setPrototypeOf(subClass, superClass) + : (subClass.__proto__ = superClass); + } + + var LocaleWithoutGlobalVariable = (function(_React$Component) { + _inherits(LocaleWithoutGlobalVariable, _React$Component); + + function LocaleWithoutGlobalVariable() { + var _temp, _this, _ret; + + _classCallCheck(this, LocaleWithoutGlobalVariable); + + for ( + var _len = arguments.length, args = Array(_len), _key = 0; + _key < _len; + _key++ + ) { + args[_key] = arguments[_key]; + } + + return ( + (_ret = ((_temp = ((_this = _possibleConstructorReturn( + this, + _React$Component.call.apply(_React$Component, [this].concat(args)) + )), + _this)), + (_this.state = { + startDate: null + }), + (_this.handleChange = function(date) { + _this.setState({ + startDate: date + }); + }), + _temp)), + _possibleConstructorReturn(_this, _ret) + ); + } + + LocaleWithoutGlobalVariable.prototype.render = function render() { + return _react2.default.createElement( + "div", + { className: "row" }, + _react2.default.createElement( + "pre", + { className: "column example__code" }, + _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 from 'react-datepicker';", + _react2.default.createElement("br", null), + "import fi from 'date-fns/locale/fi';", + _react2.default.createElement("br", null), + _react2.default.createElement("br", null), + "" + ) + ), + _react2.default.createElement( + "div", + { className: "column" }, + _react2.default.createElement(_reactDatepicker2.default, { + selected: this.state.startDate, + onChange: this.handleChange, + locale: _fi2.default + }) + ) + ); + }; + + return LocaleWithoutGlobalVariable; + })(_react2.default.Component); + + exports.default = LocaleWithoutGlobalVariable; + + /***/ + }, + /* 747 */ + /***/ function(module, exports, __webpack_require__) { + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _index = __webpack_require__(748); + + var _index2 = _interopRequireDefault(_index); + + var _index3 = __webpack_require__(749); + + var _index4 = _interopRequireDefault(_index3); + + var _index5 = __webpack_require__(750); + + var _index6 = _interopRequireDefault(_index5); + + var _index7 = __webpack_require__(751); + + var _index8 = _interopRequireDefault(_index7); + + var _index9 = __webpack_require__(752); + + var _index10 = _interopRequireDefault(_index9); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { default: obj }; + } + + /** + * @type {Locale} + * @category Locales + * @summary Finnish locale. + * @language Finnish + * @iso-639-2 fin + * @author Pyry-Samuli Lahti [@Pyppe]{@link https://github.com/Pyppe} + * @author Edo Rivai [@mikolajgrzyb]{@link https://github.com/mikolajgrzyb} + * @author Samu Juvonen [@sjuvonen]{@link https://github.com/sjuvonen} + */ + var locale = { + formatDistance: _index2.default, + formatLong: _index4.default, + formatRelative: _index6.default, + localize: _index8.default, + match: _index10.default, + options: { + weekStartsOn: 1 /* Monday */, + firstWeekContainsDate: 4 + } + }; + + exports.default = locale; + module.exports = exports["default"]; + + /***/ + }, + /* 748 */ + /***/ function(module, exports) { + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.default = formatDistance; + function futureSeconds(text) { + return text.replace(/sekuntia?/, "sekunnin"); + } + + function futureMinutes(text) { + return text.replace(/minuuttia?/, "minuutin"); + } + + function futureHours(text) { + return text.replace(/tuntia?/, "tunnin"); + } + + function futureDays(text) { + return text.replace(/päivää?/, "päivän"); + } + + function futureMonths(text) { + return text.replace(/(kuukausi|kuukautta)/, "kuukauden"); + } + + function futureYears(text) { + return text.replace(/(vuosi|vuotta)/, "vuoden"); + } + + var formatDistanceLocale = { + lessThanXSeconds: { + one: "alle sekunti", + other: "alle {{count}} sekuntia", + futureTense: futureSeconds + }, + + xSeconds: { + one: "sekunti", + other: "{{count}} sekuntia", + futureTense: futureSeconds + }, + + halfAMinute: { + one: "puoli minuuttia", + other: "puoli minuuttia", + futureTense: function futureTense(text) { + return "puolen minuutin"; + } + }, + + lessThanXMinutes: { + one: "alle minuutti", + other: "alle {{count}} minuuttia", + futureTense: futureMinutes + }, + + xMinutes: { + one: "minuutti", + other: "{{count}} minuuttia", + futureTense: futureMinutes + }, + + aboutXHours: { + one: "noin tunti", + other: "noin {{count}} tuntia", + futureTense: futureHours + }, + + xHours: { + one: "tunti", + other: "{{count}} tuntia", + futureTense: futureHours + }, + + xDays: { + one: "päivä", + other: "{{count}} päivää", + futureTense: futureDays + }, + + aboutXMonths: { + one: "noin kuukausi", + other: "noin {{count}} kuukautta", + futureTense: futureMonths + }, + + xMonths: { + one: "kuukausi", + other: "{{count}} kuukautta", + futureTense: futureMonths + }, + + aboutXYears: { + one: "noin vuosi", + other: "noin {{count}} vuotta", + futureTense: futureYears + }, + + xYears: { + one: "vuosi", + other: "{{count}} vuotta", + futureTense: futureYears + }, + + overXYears: { + one: "yli vuosi", + other: "yli {{count}} vuotta", + futureTense: futureYears + }, + + almostXYears: { + one: "lähes vuosi", + other: "lähes {{count}} vuotta", + futureTense: futureYears + } + }; + + function formatDistance(token, count, options) { + options = options || {}; + + var distance = formatDistanceLocale[token]; + var result = + count === 1 + ? distance.one + : distance.other.replace("{{count}}", count); + + if (options.addSuffix) { + if (options.comparison > 0) { + return distance.futureTense(result) + " kuluttua"; + } else { + return result + " sitten"; + } + } + + return result; + } + module.exports = exports["default"]; + + /***/ + }, + /* 749 */ + /***/ function(module, exports, __webpack_require__) { + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _index = __webpack_require__(552); + + var _index2 = _interopRequireDefault(_index); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { default: obj }; + } + + var dateFormats = { + full: "eeee d. MMMM y", + long: "d. MMMM y", + medium: "d. MMM y", + short: "d.M.y" + }; + + var timeFormats = { + full: "HH.mm.ss zzzz", + long: "HH.mm.ss z", + medium: "HH.mm.ss", + short: "HH.mm" + }; + + var dateTimeFormats = { + full: "{{date}} 'klo' {{time}}", + long: "{{date}} 'klo' {{time}}", + medium: "{{date}} {{time}}", + short: "{{date}} {{time}}" + }; + + var formatLong = { + date: (0, _index2.default)({ + formats: dateFormats, + defaultWidth: "full" + }), + + time: (0, _index2.default)({ + formats: timeFormats, + defaultWidth: "full" + }), + + dateTime: (0, _index2.default)({ + formats: dateTimeFormats, + defaultWidth: "full" + }) + }; + + exports.default = formatLong; + module.exports = exports["default"]; + + /***/ + }, + /* 750 */ + /***/ function(module, exports) { + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + exports.default = formatRelative; + var formatRelativeLocale = { + lastWeek: "'viime' eeee 'klo' p", + yesterday: "'eilen klo' p", + today: "'tänään klo' p", + tomorrow: "'huomenna klo' p", + nextWeek: "'ensi' eeee 'klo' p", + other: "P" + }; + + function formatRelative(token, date, baseDate, options) { + return formatRelativeLocale[token]; + } + module.exports = exports["default"]; + + /***/ + }, + /* 751 */ + /***/ function(module, exports, __webpack_require__) { + "use strict"; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + var _index = __webpack_require__(555); + + var _index2 = _interopRequireDefault(_index); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { default: obj }; + } + + var eraValues = { + narrow: ["eaa.", "jaa."], + abbreviated: ["eaa.", "jaa."], + wide: ["ennen ajanlaskun alkua", "jälkeen ajanlaskun alun"] + }; + + var quarterValues = { + narrow: ["1", "2", "3", "4"], + abbreviated: ["Q1", "Q2", "Q3", "Q4"], + wide: ["1. kvartaali", "2. kvartaali", "3. kvartaali", "4. kvartaali"] + }; + + var monthValues = { + narrow: ["T", "H", "M", "H", "T", "K", "H", "E", "S", "L", "M", "J"], + abbreviated: [ + "tammi", + "helmi", + "maalis", + "huhti", + "touko", + "kesä", + "heinä", + "elo", + "syys", + "loka", + "marras", + "joulu" + ], + wide: [ + "tammikuu", + "helmikuu", + "maaliskuu", + "huhtikuu", + "toukokuu", + "kesäkuu", + "heinäkuu", + "elokuu", + "syyskuu", + "lokakuu", + "marraskuu", + "joulukuu" + ] + }; + + var formattingMonthValues = { + narrow: monthValues.narrow, + abbreviated: monthValues.abbreviated, + wide: monthValues.wide.map(function(name) { + return name + "ta"; + }) + }; + + var dayValues = { + narrow: ["S", "M", "T", "K", "T", "P", "L"], + short: ["su", "ma", "ti", "ke", "to", "pe", "la"], + abbreviated: [ + "sunn.", + "maan.", + "tiis.", + "kesk.", + "torst.", + "perj.", + "la" + ], + wide: [ + "sunnuntai", + "maanantai", + "tiistai", + "keskiviikko", + "torstai", + "perjantai", + "lauantai" + ] + }; + + var formattingDayValues = { + narrow: dayValues.narrow, + short: dayValues.short, + abbreviated: dayValues.abbreviated, + wide: dayValues.wide.map(function(name) { + return name + "na"; + }) + }; + + var dayPeriodValues = { + narrow: { + am: "ap", + pm: "ip", + midnight: "keskiyö", + noon: "keskipäivä", + morning: "ap", + afternoon: "ip", + evening: "illalla", + night: "yöllä" + }, + abbreviated: { + am: "ap", + pm: "ip", + midnight: "keskiyö", + noon: "keskipäivä", + morning: "ap", + afternoon: "ip", + evening: "illalla", + night: "yöllä" + }, + wide: { + am: "ap", + pm: "ip", + midnight: "keskiyöllä", + noon: "keskipäivällä", + morning: "aamupäivällä", + afternoon: "iltapäivällä", + evening: "illalla", + night: "yöllä" + } + }; + + function ordinalNumber(dirtyNumber) { + var number = Number(dirtyNumber); + return number + "."; + } + + var localize = { + ordinalNumber: ordinalNumber, + + era: (0, _index2.default)({ + values: eraValues, + defaultWidth: "wide" + }), + + quarter: (0, _index2.default)({ + values: quarterValues, + defaultWidth: "wide", + argumentCallback: function argumentCallback(quarter) { + return Number(quarter) - 1; + } + }), + + month: (0, _index2.default)({ + values: monthValues, + formattingValues: formattingMonthValues, + defaultWidth: "wide" + }), + + day: (0, _index2.default)({ + values: dayValues, + formattingValues: formattingDayValues, + defaultWidth: "wide" + }), + + dayPeriod: (0, _index2.default)({ + values: dayPeriodValues, + defaultWidth: "wide" + }) + }; + + exports.default = localize; + module.exports = exports["default"]; + + /***/ + }, + /* 752 */ + 556, + /* 753 */ + /***/ function(module, exports, __webpack_require__) { + "use strict"; + + exports.__esModule = true; + + var _react = __webpack_require__(327); + + var _react2 = _interopRequireDefault(_react); + + var _reactDatepicker = __webpack_require__(532); + + var _reactDatepicker2 = _interopRequireDefault(_reactDatepicker); + var _subDays = __webpack_require__(582); var _subDays2 = _interopRequireDefault(_subDays); @@ -61481,7 +62224,7 @@ /***/ }, - /* 747 */ + /* 754 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -61629,7 +62372,7 @@ /***/ }, - /* 748 */ + /* 755 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -61818,7 +62561,7 @@ /***/ }, - /* 749 */ + /* 756 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -61961,7 +62704,7 @@ /***/ }, - /* 750 */ + /* 757 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -62105,7 +62848,7 @@ /***/ }, - /* 751 */ + /* 758 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -62230,7 +62973,7 @@ /***/ }, - /* 752 */ + /* 759 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -62354,7 +63097,7 @@ /***/ }, - /* 753 */ + /* 760 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -62466,7 +63209,7 @@ /***/ }, - /* 754 */ + /* 761 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -62630,7 +63373,7 @@ /***/ }, - /* 755 */ + /* 762 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -62753,7 +63496,7 @@ /***/ }, - /* 756 */ + /* 763 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -62894,7 +63637,7 @@ /***/ }, - /* 757 */ + /* 764 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63023,7 +63766,7 @@ /***/ }, - /* 758 */ + /* 765 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63134,7 +63877,7 @@ /***/ }, - /* 759 */ + /* 766 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63248,7 +63991,7 @@ /***/ }, - /* 760 */ + /* 767 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63359,7 +64102,7 @@ /***/ }, - /* 761 */ + /* 768 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63481,7 +64224,7 @@ /***/ }, - /* 762 */ + /* 769 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63593,7 +64336,7 @@ /***/ }, - /* 763 */ + /* 770 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63707,7 +64450,7 @@ /***/ }, - /* 764 */ + /* 771 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63818,7 +64561,7 @@ /***/ }, - /* 765 */ + /* 772 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -63929,7 +64672,7 @@ /***/ }, - /* 766 */ + /* 773 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -64052,7 +64795,7 @@ /***/ }, - /* 767 */ + /* 774 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -64181,7 +64924,7 @@ /***/ }, - /* 768 */ + /* 775 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -64292,7 +65035,7 @@ /***/ }, - /* 769 */ + /* 776 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -64439,7 +65182,7 @@ /***/ }, - /* 770 */ + /* 777 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -64550,7 +65293,7 @@ /***/ }, - /* 771 */ + /* 778 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -64662,7 +65405,7 @@ /***/ }, - /* 772 */ + /* 779 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -64774,7 +65517,7 @@ /***/ }, - /* 773 */ + /* 780 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -64892,7 +65635,7 @@ /***/ }, - /* 774 */ + /* 781 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -65037,7 +65780,7 @@ /***/ }, - /* 775 */ + /* 782 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -65148,7 +65891,7 @@ /***/ }, - /* 776 */ + /* 783 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -65278,7 +66021,7 @@ /***/ }, - /* 777 */ + /* 784 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -65415,7 +66158,7 @@ /***/ }, - /* 778 */ + /* 785 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -65540,7 +66283,7 @@ /***/ }, - /* 779 */ + /* 786 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -65661,7 +66404,7 @@ /***/ }, - /* 780 */ + /* 787 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -65782,7 +66525,7 @@ /***/ }, - /* 781 */ + /* 788 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -65955,7 +66698,7 @@ /***/ }, - /* 782 */ + /* 789 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -66116,7 +66859,7 @@ /***/ }, - /* 783 */ + /* 790 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -66289,7 +67032,7 @@ /***/ }, - /* 784 */ + /* 791 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -66445,7 +67188,7 @@ /***/ }, - /* 785 */ + /* 792 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -66556,7 +67299,7 @@ /***/ }, - /* 786 */ + /* 793 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -66570,7 +67313,7 @@ var _reactDatepicker2 = _interopRequireDefault(_reactDatepicker); - var _range = __webpack_require__(787); + var _range = __webpack_require__(794); var _range2 = _interopRequireDefault(_range); @@ -66767,9 +67510,9 @@ /***/ }, - /* 787 */ + /* 794 */ /***/ function(module, exports, __webpack_require__) { - var createRange = __webpack_require__(788); + var createRange = __webpack_require__(795); /** * Creates an array of numbers (positive and/or negative) progressing from @@ -66818,11 +67561,11 @@ /***/ }, - /* 788 */ + /* 795 */ /***/ function(module, exports, __webpack_require__) { - var baseRange = __webpack_require__(789), - isIterateeCall = __webpack_require__(790), - toFinite = __webpack_require__(803); + var baseRange = __webpack_require__(796), + isIterateeCall = __webpack_require__(797), + toFinite = __webpack_require__(810); /** * Creates a `_.range` or `_.rangeRight` function. @@ -66857,7 +67600,7 @@ /***/ }, - /* 789 */ + /* 796 */ /***/ function(module, exports) { /* Built-in method references for those with the same name as other `lodash` methods. */ var nativeCeil = Math.ceil, @@ -66890,12 +67633,12 @@ /***/ }, - /* 790 */ + /* 797 */ /***/ function(module, exports, __webpack_require__) { - var eq = __webpack_require__(791), - isArrayLike = __webpack_require__(792), - isIndex = __webpack_require__(802), - isObject = __webpack_require__(800); + var eq = __webpack_require__(798), + isArrayLike = __webpack_require__(799), + isIndex = __webpack_require__(809), + isObject = __webpack_require__(807); /** * Checks if the given arguments are from an iteratee call. @@ -66926,7 +67669,7 @@ /***/ }, - /* 791 */ + /* 798 */ /***/ function(module, exports) { /** * Performs a @@ -66968,10 +67711,10 @@ /***/ }, - /* 792 */ + /* 799 */ /***/ function(module, exports, __webpack_require__) { - var isFunction = __webpack_require__(793), - isLength = __webpack_require__(801); + var isFunction = __webpack_require__(800), + isLength = __webpack_require__(808); /** * Checks if `value` is array-like. A value is considered array-like if it's @@ -67006,10 +67749,10 @@ /***/ }, - /* 793 */ + /* 800 */ /***/ function(module, exports, __webpack_require__) { - var baseGetTag = __webpack_require__(794), - isObject = __webpack_require__(800); + var baseGetTag = __webpack_require__(801), + isObject = __webpack_require__(807); /** `Object#toString` result references. */ var asyncTag = "[object AsyncFunction]", @@ -67050,11 +67793,11 @@ /***/ }, - /* 794 */ + /* 801 */ /***/ function(module, exports, __webpack_require__) { - var Symbol = __webpack_require__(795), - getRawTag = __webpack_require__(798), - objectToString = __webpack_require__(799); + var Symbol = __webpack_require__(802), + getRawTag = __webpack_require__(805), + objectToString = __webpack_require__(806); /** `Object#toString` result references. */ var nullTag = "[object Null]", @@ -67083,9 +67826,9 @@ /***/ }, - /* 795 */ + /* 802 */ /***/ function(module, exports, __webpack_require__) { - var root = __webpack_require__(796); + var root = __webpack_require__(803); /** Built-in value references. */ var Symbol = root.Symbol; @@ -67094,9 +67837,9 @@ /***/ }, - /* 796 */ + /* 803 */ /***/ function(module, exports, __webpack_require__) { - var freeGlobal = __webpack_require__(797); + var freeGlobal = __webpack_require__(804); /** Detect free variable `self`. */ var freeSelf = @@ -67109,7 +67852,7 @@ /***/ }, - /* 797 */ + /* 804 */ /***/ function(module, exports) { /* WEBPACK VAR INJECTION */ (function(global) { /** Detect free variable `global` from Node.js. */ @@ -67131,9 +67874,9 @@ /***/ }, - /* 798 */ + /* 805 */ /***/ function(module, exports, __webpack_require__) { - var Symbol = __webpack_require__(795); + var Symbol = __webpack_require__(802); /** Used for built-in method references. */ var objectProto = Object.prototype; @@ -67182,7 +67925,7 @@ /***/ }, - /* 799 */ + /* 806 */ /***/ function(module, exports) { /** Used for built-in method references. */ var objectProto = Object.prototype; @@ -67209,7 +67952,7 @@ /***/ }, - /* 800 */ + /* 807 */ /***/ function(module, exports) { /** * Checks if `value` is the @@ -67245,7 +67988,7 @@ /***/ }, - /* 801 */ + /* 808 */ /***/ function(module, exports) { /** Used as references for various `Number` constants. */ var MAX_SAFE_INTEGER = 9007199254740991; @@ -67289,7 +68032,7 @@ /***/ }, - /* 802 */ + /* 809 */ /***/ function(module, exports) { /** Used as references for various `Number` constants. */ var MAX_SAFE_INTEGER = 9007199254740991; @@ -67318,9 +68061,9 @@ /***/ }, - /* 803 */ + /* 810 */ /***/ function(module, exports, __webpack_require__) { - var toNumber = __webpack_require__(804); + var toNumber = __webpack_require__(811); /** Used as references for various `Number` constants. */ var INFINITY = 1 / 0, @@ -67365,10 +68108,10 @@ /***/ }, - /* 804 */ + /* 811 */ /***/ function(module, exports, __webpack_require__) { - var isObject = __webpack_require__(800), - isSymbol = __webpack_require__(805); + var isObject = __webpack_require__(807), + isSymbol = __webpack_require__(812); /** Used as references for various `Number` constants. */ var NAN = 0 / 0; @@ -67430,19 +68173,17 @@ var isBinary = reIsBinary.test(value); return isBinary || reIsOctal.test(value) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) - : reIsBadHex.test(value) - ? NAN - : +value; + : reIsBadHex.test(value) ? NAN : +value; } module.exports = toNumber; /***/ }, - /* 805 */ + /* 812 */ /***/ function(module, exports, __webpack_require__) { - var baseGetTag = __webpack_require__(794), - isObjectLike = __webpack_require__(806); + var baseGetTag = __webpack_require__(801), + isObjectLike = __webpack_require__(813); /** `Object#toString` result references. */ var symbolTag = "[object Symbol]"; @@ -67475,7 +68216,7 @@ /***/ }, - /* 806 */ + /* 813 */ /***/ function(module, exports) { /** * Checks if `value` is object-like. A value is object-like if it's not `null` @@ -67509,7 +68250,131 @@ /***/ }, - /* 807 */ + /* 814 */ + /***/ function(module, exports, __webpack_require__) { + "use strict"; + + exports.__esModule = true; + + var _react = __webpack_require__(327); + + var _react2 = _interopRequireDefault(_react); + + var _reactDatepicker = __webpack_require__(532); + + var _reactDatepicker2 = _interopRequireDefault(_reactDatepicker); + + var _getDate = __webpack_require__(590); + + var _getDate2 = _interopRequireDefault(_getDate); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { default: obj }; + } + + function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError("Cannot call a class as a function"); + } + } + + function _possibleConstructorReturn(self, call) { + if (!self) { + throw new ReferenceError( + "this hasn't been initialised - super() hasn't been called" + ); + } + return call && (typeof call === "object" || typeof call === "function") + ? call + : self; + } + + function _inherits(subClass, superClass) { + if (typeof superClass !== "function" && superClass !== null) { + throw new TypeError( + "Super expression must either be null or a function, not " + + typeof superClass + ); + } + subClass.prototype = Object.create(superClass && superClass.prototype, { + constructor: { + value: subClass, + enumerable: false, + writable: true, + configurable: true + } + }); + if (superClass) + Object.setPrototypeOf + ? Object.setPrototypeOf(subClass, superClass) + : (subClass.__proto__ = superClass); + } + + var RenderCustomDay = (function(_React$Component) { + _inherits(RenderCustomDay, _React$Component); + + function RenderCustomDay(props) { + _classCallCheck(this, RenderCustomDay); + + var _this = _possibleConstructorReturn( + this, + _React$Component.call(this, props) + ); + + _this.handleChange = function(date) { + _this.setState({ + startDate: date + }); + }; + + _this.renderDayContents = function(day, date) { + var tooltipText = "Tooltip for date: " + date; + return _react2.default.createElement( + "span", + { title: tooltipText }, + (0, _getDate2.default)(date) + ); + }; + + _this.state = { + startDate: new Date() + }; + return _this; + } + + RenderCustomDay.prototype.render = function render() { + return _react2.default.createElement( + "div", + { className: "row" }, + _react2.default.createElement( + "pre", + { className: "column example__code" }, + _react2.default.createElement( + "code", + { className: "jsx" }, + "\n\n" + ) + ), + _react2.default.createElement( + "div", + { className: "column" }, + _react2.default.createElement(_reactDatepicker2.default, { + selected: this.state.startDate, + onChange: this.handleChange, + renderDayContents: this.renderDayContents + }) + ) + ); + }; + + return RenderCustomDay; + })(_react2.default.Component); + + exports.default = RenderCustomDay; + + /***/ + }, + /* 815 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -67622,14 +68487,237 @@ /***/ }, - /* 808 */ + /* 816 */ + /***/ function(module, exports, __webpack_require__) { + "use strict"; + + exports.__esModule = true; + + var _react = __webpack_require__(327); + + var _react2 = _interopRequireDefault(_react); + + var _reactDatepicker = __webpack_require__(532); + + var _reactDatepicker2 = _interopRequireDefault(_reactDatepicker); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { default: obj }; + } + + function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError("Cannot call a class as a function"); + } + } + + function _possibleConstructorReturn(self, call) { + if (!self) { + throw new ReferenceError( + "this hasn't been initialised - super() hasn't been called" + ); + } + return call && (typeof call === "object" || typeof call === "function") + ? call + : self; + } + + function _inherits(subClass, superClass) { + if (typeof superClass !== "function" && superClass !== null) { + throw new TypeError( + "Super expression must either be null or a function, not " + + typeof superClass + ); + } + subClass.prototype = Object.create(superClass && superClass.prototype, { + constructor: { + value: subClass, + enumerable: false, + writable: true, + configurable: true + } + }); + if (superClass) + Object.setPrototypeOf + ? Object.setPrototypeOf(subClass, superClass) + : (subClass.__proto__ = superClass); + } + + var StrictParsing = (function(_React$Component) { + _inherits(StrictParsing, _React$Component); + + function StrictParsing(props) { + _classCallCheck(this, StrictParsing); + + var _this = _possibleConstructorReturn( + this, + _React$Component.call(this, props) + ); + + _this.handleChange = function(date) { + _this.setState({ + startDate: date + }); + }; + + _this.state = { + startDate: new Date() + }; + return _this; + } + + StrictParsing.prototype.render = function render() { + return _react2.default.createElement( + "div", + { className: "row" }, + _react2.default.createElement( + "pre", + { className: "column example__code" }, + _react2.default.createElement( + "code", + { className: "jsx" }, + "\n\n" + ) + ), + _react2.default.createElement( + "div", + { className: "column" }, + _react2.default.createElement(_reactDatepicker2.default, { + selected: this.state.startDate, + onChange: this.handleChange, + strictParsing: true + }) + ) + ); + }; + + return StrictParsing; + })(_react2.default.Component); + + exports.default = StrictParsing; + + /***/ + }, + /* 817 */ + /***/ function(module, exports, __webpack_require__) { + "use strict"; + + exports.__esModule = true; + + var _react = __webpack_require__(327); + + var _react2 = _interopRequireDefault(_react); + + var _reactDatepicker = __webpack_require__(532); + + var _reactDatepicker2 = _interopRequireDefault(_reactDatepicker); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { default: obj }; + } + + function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError("Cannot call a class as a function"); + } + } + + function _possibleConstructorReturn(self, call) { + if (!self) { + throw new ReferenceError( + "this hasn't been initialised - super() hasn't been called" + ); + } + return call && (typeof call === "object" || typeof call === "function") + ? call + : self; + } + + function _inherits(subClass, superClass) { + if (typeof superClass !== "function" && superClass !== null) { + throw new TypeError( + "Super expression must either be null or a function, not " + + typeof superClass + ); + } + subClass.prototype = Object.create(superClass && superClass.prototype, { + constructor: { + value: subClass, + enumerable: false, + writable: true, + configurable: true + } + }); + if (superClass) + Object.setPrototypeOf + ? Object.setPrototypeOf(subClass, superClass) + : (subClass.__proto__ = superClass); + } + + var MonthPicker = (function(_React$Component) { + _inherits(MonthPicker, _React$Component); + + function MonthPicker(props) { + _classCallCheck(this, MonthPicker); + + var _this = _possibleConstructorReturn( + this, + _React$Component.call(this, props) + ); + + _this.handleChange = function(date) { + _this.setState({ + startDate: date + }); + }; + + _this.state = { + startDate: new Date() + }; + return _this; + } + + MonthPicker.prototype.render = function render() { + return _react2.default.createElement( + "div", + { className: "row" }, + _react2.default.createElement( + "pre", + { className: "column example__code" }, + _react2.default.createElement( + "code", + { className: "jsx" }, + '\n\n' + ) + ), + _react2.default.createElement( + "div", + { className: "column" }, + _react2.default.createElement(_reactDatepicker2.default, { + selected: this.state.startDate, + onChange: this.handleChange, + dateFormat: "MM/yyyy", + showMonthYearPicker: true + }) + ) + ); + }; + + return MonthPicker; + })(_react2.default.Component); + + exports.default = MonthPicker; + + /***/ + }, + /* 818 */ /***/ function(module, exports) { // removed by extract-text-webpack-plugin /***/ }, - /* 809 */ - 808, - /* 810 */ + /* 819 */ + 818, + /* 820 */ /***/ function(module, exports, __webpack_require__) { "use strict"; @@ -67723,7 +68811,7 @@ /***/ }, - /* 811 */ + /* 821 */ /***/ function( module, exports, @@ -68011,7 +69099,8 @@ }); for ( - 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 + 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( "," ), j = 0; @@ -68117,7 +69206,7 @@ /***/ }, - /* 812 */ + /* 822 */ /***/ function( module, exports, @@ -68139,7 +69228,7 @@ /***/ }, - /* 813 */ + /* 823 */ /***/ function( module, exports, @@ -68165,7 +69254,7 @@ /***/ }, - /* 814 */ + /* 824 */ /***/ function( module, exports, @@ -68206,7 +69295,7 @@ /***/ }, - /* 815 */ + /* 825 */ /***/ function( module, exports, @@ -68223,7 +69312,7 @@ /***/ }, - /* 816 */ + /* 826 */ /***/ function( module, exports, @@ -68254,7 +69343,7 @@ /***/ }, - /* 817 */ + /* 827 */ /***/ function( module, exports, @@ -68275,7 +69364,7 @@ /***/ }, - /* 818 */ + /* 828 */ /***/ function( module, exports, @@ -68313,7 +69402,7 @@ /***/ }, - /* 819 */ + /* 829 */ /***/ function( module, exports, @@ -68348,7 +69437,7 @@ /***/ }, - /* 820 */ + /* 830 */ /***/ function( module, exports, @@ -68432,7 +69521,7 @@ /***/ }, - /* 821 */ + /* 831 */ /***/ function( module, exports, @@ -68448,7 +69537,7 @@ /***/ }, - /* 822 */ + /* 832 */ /***/ function( module, exports, @@ -68470,7 +69559,7 @@ /***/ }, - /* 823 */ + /* 833 */ /***/ function( module, exports, @@ -68500,7 +69589,7 @@ /***/ }, - /* 824 */ + /* 834 */ /***/ function( module, exports, @@ -68511,7 +69600,7 @@ /***/ }, - /* 825 */ + /* 835 */ /***/ function( module, exports, @@ -68538,7 +69627,7 @@ /***/ }, - /* 826 */ + /* 836 */ /***/ function( module, exports, @@ -68567,7 +69656,7 @@ /***/ }, - /* 827 */ + /* 837 */ /***/ function( module, exports, @@ -68589,7 +69678,7 @@ /***/ }, - /* 828 */ + /* 838 */ /***/ function( module, exports, @@ -68626,7 +69715,7 @@ /***/ }, - /* 829 */ + /* 839 */ /***/ function( module, exports, @@ -68643,7 +69732,7 @@ /***/ }, - /* 830 */ + /* 840 */ /***/ function( module, exports, @@ -68661,7 +69750,7 @@ /***/ }, - /* 831 */ + /* 841 */ /***/ function( module, exports, @@ -68707,7 +69796,7 @@ /***/ }, - /* 832 */ + /* 842 */ /***/ function( module, exports, @@ -68725,7 +69814,7 @@ /***/ }, - /* 833 */ + /* 843 */ /***/ function( module, exports, @@ -68744,7 +69833,7 @@ /***/ }, - /* 834 */ + /* 844 */ /***/ function( module, exports, @@ -68762,7 +69851,7 @@ /***/ }, - /* 835 */ + /* 845 */ /***/ function( module, exports, @@ -68779,7 +69868,7 @@ /***/ }, - /* 836 */ + /* 846 */ /***/ function( module, exports, @@ -68851,7 +69940,7 @@ /***/ }, - /* 837 */ + /* 847 */ /***/ function( module, exports, @@ -68883,7 +69972,7 @@ /***/ }, - /* 838 */ + /* 848 */ /***/ function( module, exports, @@ -68896,7 +69985,7 @@ /***/ }, - /* 839 */ + /* 849 */ /***/ function( module, exports, @@ -68932,7 +70021,7 @@ /***/ }, - /* 840 */ + /* 850 */ /***/ function( module, exports, @@ -68954,7 +70043,7 @@ /***/ }, - /* 841 */ + /* 851 */ /***/ function( module, exports, @@ -68999,7 +70088,7 @@ /***/ }, - /* 842 */ + /* 852 */ /***/ function( module, exports, @@ -69015,7 +70104,7 @@ /***/ }, - /* 843 */ + /* 853 */ /***/ function( module, exports, @@ -69030,7 +70119,7 @@ /***/ }, - /* 844 */ + /* 854 */ /***/ function( module, exports, @@ -69065,7 +70154,7 @@ /***/ }, - /* 845 */ + /* 855 */ /***/ function( module, exports, @@ -69082,7 +70171,7 @@ /***/ }, - /* 846 */ + /* 856 */ /***/ function( module, exports, @@ -69146,7 +70235,7 @@ /***/ }, - /* 847 */ + /* 857 */ /***/ function( module, exports, @@ -69164,7 +70253,7 @@ /***/ }, - /* 848 */ + /* 858 */ /***/ function( module, exports, @@ -69220,7 +70309,7 @@ /***/ }, - /* 849 */ + /* 859 */ /***/ function( module, exports, @@ -69255,7 +70344,7 @@ /***/ }, - /* 850 */ + /* 860 */ /***/ function( module, exports, @@ -69282,18 +70371,16 @@ i + 1 === l || (b = s.charCodeAt(i + 1)) < 0xdc00 || b > 0xdfff - ? TO_STRING - ? s.charAt(i) - : a + ? TO_STRING ? s.charAt(i) : a : TO_STRING - ? s.slice(i, i + 2) - : ((a - 0xd800) << 10) + (b - 0xdc00) + 0x10000; + ? s.slice(i, i + 2) + : ((a - 0xd800) << 10) + (b - 0xdc00) + 0x10000; }; }; /***/ }, - /* 851 */ + /* 861 */ /***/ function( module, exports, @@ -69375,9 +70462,7 @@ proto[ITERATOR] || proto[FF_ITERATOR] || (DEFAULT && proto[DEFAULT]); var $default = $native || getMethod(DEFAULT); var $entries = DEFAULT - ? !DEF_VALUES - ? $default - : getMethod("entries") + ? !DEF_VALUES ? $default : getMethod("entries") : undefined; var $anyNative = NAME == "Array" ? proto.entries || $native : $native; var methods, key, IteratorPrototype; @@ -69431,7 +70516,7 @@ /***/ }, - /* 852 */ + /* 862 */ /***/ function( module, exports, @@ -69470,7 +70555,7 @@ /***/ }, - /* 853 */ + /* 863 */ /***/ function( module, exports, @@ -69532,7 +70617,7 @@ /***/ }, - /* 854 */ + /* 864 */ /***/ function( module, exports, @@ -69545,7 +70630,7 @@ /***/ }, - /* 855 */ + /* 865 */ /***/ function( module, exports, @@ -69556,7 +70641,7 @@ /***/ }, - /* 856 */ + /* 866 */ /***/ function( module, exports, @@ -69602,7 +70687,7 @@ /***/ }, - /* 857 */ + /* 867 */ /***/ function( module, exports, diff --git a/docs-site/src/example_components.jsx b/docs-site/src/example_components.jsx index b0f3cf40c..a5f38c54a 100644 --- a/docs-site/src/example_components.jsx +++ b/docs-site/src/example_components.jsx @@ -55,6 +55,7 @@ import RenderCustomHeader from "./examples/render_custom_header"; import RenderCustomDay from "./examples/render_custom_day"; import TimeInput from "./examples/timeInput"; import StrictParsing from "./examples/strict_parsing"; +import MonthPicker from "./examples/month_picker"; import "react-datepicker/dist/react-datepicker.css"; import "./style.scss"; @@ -275,6 +276,10 @@ export default class exampleComponents extends React.Component { { title: "Strict parsing", component: + }, + { + title: "Month Picker", + component: } ]; diff --git a/docs-site/src/examples/month_picker.jsx b/docs-site/src/examples/month_picker.jsx new file mode 100644 index 000000000..9f287f705 --- /dev/null +++ b/docs-site/src/examples/month_picker.jsx @@ -0,0 +1,44 @@ +import React from "react"; +import DatePicker from "react-datepicker"; + +export default class MonthPicker extends React.Component { + constructor(props) { + super(props); + this.state = { + startDate: new Date() + }; + } + + handleChange = date => { + this.setState({ + startDate: date + }); + }; + + render() { + return ( +
+ 
+          
+            {`
+
+`}
+          
+
+
+ +
+
+ ); + } +} diff --git a/docs-site/style.css b/docs-site/style.css index 8146e2a29..0c50dedbe 100644 --- a/docs-site/style.css +++ b/docs-site/style.css @@ -168,7 +168,8 @@ } .react-datepicker__current-month, -.react-datepicker-time__header { +.react-datepicker-time__header, +.react-datepicker-year-header { margin-top: 0; color: #000; font-weight: bold; @@ -254,6 +255,10 @@ margin: 0.4rem; text-align: center; } +.react-datepicker__month .react-datepicker__month-text { + display: inline-block; + width: 4rem; +} .react-datepicker__input-time-container { clear: both; @@ -423,63 +428,82 @@ margin: 0.166rem; } -.react-datepicker__day { +.react-datepicker__day, +.react-datepicker__month-text { cursor: pointer; } -.react-datepicker__day:hover { +.react-datepicker__day:hover, +.react-datepicker__month-text:hover { border-radius: 0.3rem; background-color: #f0f0f0; } -.react-datepicker__day--today { +.react-datepicker__day--today, +.react-datepicker__month-text--today { font-weight: bold; } -.react-datepicker__day--highlighted { +.react-datepicker__day--highlighted, +.react-datepicker__month-text--highlighted { border-radius: 0.3rem; background-color: #3dcc4a; color: #fff; } -.react-datepicker__day--highlighted:hover { +.react-datepicker__day--highlighted:hover, +.react-datepicker__month-text--highlighted:hover { background-color: #32be3f; } -.react-datepicker__day--highlighted-custom-1 { +.react-datepicker__day--highlighted-custom-1, +.react-datepicker__month-text--highlighted-custom-1 { color: magenta; } -.react-datepicker__day--highlighted-custom-2 { +.react-datepicker__day--highlighted-custom-2, +.react-datepicker__month-text--highlighted-custom-2 { color: green; } .react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, -.react-datepicker__day--in-range { +.react-datepicker__day--in-range, +.react-datepicker__month-text--selected, +.react-datepicker__month-text--in-selecting-range, +.react-datepicker__month-text--in-range { border-radius: 0.3rem; background-color: #216ba5; color: #fff; } .react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover, -.react-datepicker__day--in-range:hover { +.react-datepicker__day--in-range:hover, +.react-datepicker__month-text--selected:hover, +.react-datepicker__month-text--in-selecting-range:hover, +.react-datepicker__month-text--in-range:hover { background-color: #1d5d90; } -.react-datepicker__day--keyboard-selected { +.react-datepicker__day--keyboard-selected, +.react-datepicker__month-text--keyboard-selected { border-radius: 0.3rem; background-color: #2a87d0; color: #fff; } -.react-datepicker__day--keyboard-selected:hover { +.react-datepicker__day--keyboard-selected:hover, +.react-datepicker__month-text--keyboard-selected:hover { background-color: #1d5d90; } -.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) { +.react-datepicker__day--in-selecting-range, +.react-datepicker__month-text--in-selecting-range { background-color: rgba(33, 107, 165, 0.5); } +.react-datepicker__month--selecting-range .react-datepicker__day--in-range, .react-datepicker__month--selecting-range - .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range) { + .react-datepicker__month-text--in-range { background-color: #f0f0f0; color: #000; } -.react-datepicker__day--disabled { +.react-datepicker__day--disabled, +.react-datepicker__month-text--disabled { cursor: default; color: #ccc; } -.react-datepicker__day--disabled:hover { +.react-datepicker__day--disabled:hover, +.react-datepicker__month-text--disabled:hover { background-color: transparent; } diff --git a/src/calendar.jsx b/src/calendar.jsx index 44431d7c1..5658b9dc5 100644 --- a/src/calendar.jsx +++ b/src/calendar.jsx @@ -21,6 +21,8 @@ import { setYear, getYear, isBefore, + addYears, + subYears, isAfter, getFormattedWeekdayInLocale, getWeekdayShortInLocale, @@ -84,6 +86,7 @@ export default class Calendar extends React.Component { onWeekSelect: PropTypes.func, showTimeSelect: PropTypes.bool, showTimeInput: PropTypes.bool, + showMonthYearPicker: PropTypes.bool, showTimeSelectOnly: PropTypes.bool, timeFormat: PropTypes.string, timeIntervals: PropTypes.number, @@ -118,6 +121,8 @@ export default class Calendar extends React.Component { showDisabledMonthNavigation: PropTypes.bool, previousMonthButtonLabel: PropTypes.string, nextMonthButtonLabel: PropTypes.string, + previousYearButtonLabel: PropTypes.string, + nextYearButtonLabel: PropTypes.string, renderCustomHeader: PropTypes.func, renderDayContents: PropTypes.func, onDayMouseEnter: PropTypes.func, @@ -131,6 +136,8 @@ export default class Calendar extends React.Component { monthSelectedIn: 0, forceShowMonthNavigation: false, timeCaption: "Time", + previousYearButtonLabel: "Previous Year", + nextYearButtonLabel: "Next Year", previousMonthButtonLabel: "Previous Month", nextMonthButtonLabel: "Next Month" }; @@ -322,7 +329,16 @@ export default class Calendar extends React.Component { : getWeekdayMinInLocale(day, locale); }; - renderPreviousMonthButton = () => { + decreaseYear = () => { + this.setState( + { + date: subYears(this.state.date, 1) + }, + () => this.handleYearChange(this.state.date) + ); + }; + + renderPreviousButton = () => { if (this.props.renderCustomHeader) { return; } @@ -348,6 +364,10 @@ export default class Calendar extends React.Component { let clickHandler = this.decreaseMonth; + if (this.props.showMonthYearPicker) { + clickHandler = this.decreaseYear; + } + if (allPrevDaysDisabled && this.props.showDisabledMonthNavigation) { classes.push("react-datepicker__navigation--previous--disabled"); clickHandler = null; @@ -359,12 +379,23 @@ export default class Calendar extends React.Component { className={classes.join(" ")} onClick={clickHandler} > - {this.props.previousMonthButtonLabel} + {this.props.showMonthYearPicker + ? this.props.previousYearButtonLabel + : this.props.previousMonthButtonLabel} ); }; - renderNextMonthButton = () => { + increaseYear = () => { + this.setState( + { + date: addYears(this.state.date, 1) + }, + () => this.handleYearChange(this.state.date) + ); + }; + + renderNextButton = () => { if (this.props.renderCustomHeader) { return; } @@ -393,6 +424,10 @@ export default class Calendar extends React.Component { let clickHandler = this.increaseMonth; + if (this.props.showMonthYearPicker) { + clickHandler = this.increaseYear; + } + if (allNextDaysDisabled && this.props.showDisabledMonthNavigation) { classes.push("react-datepicker__navigation--next--disabled"); clickHandler = null; @@ -404,7 +439,9 @@ export default class Calendar extends React.Component { className={classes.join(" ")} onClick={clickHandler} > - {this.props.nextMonthButtonLabel} + {this.props.showMonthYearPicker + ? this.props.nextYearButtonLabel + : this.props.nextMonthButtonLabel} ); }; @@ -551,6 +588,14 @@ export default class Calendar extends React.Component { ); }; + renderYearHeader = () => { + return ( +
+ {getYear(this.state.date)} +
+ ); + }; + renderMonths = () => { if (this.props.showTimeSelectOnly) { return; @@ -569,10 +614,13 @@ export default class Calendar extends React.Component { }} className="react-datepicker__month-container" > - {this.props.renderCustomHeader - ? this.renderCustomHeader({ monthDate, i }) - : this.renderDefaultHeader({ monthDate, i })} + {!this.props.showMonthYearPicker + ? this.props.renderCustomHeader + ? this.renderCustomHeader({ monthDate, i }) + : this.renderDefaultHeader({ monthDate, i }) + : this.renderYearHeader({ monthDate, i })} ); @@ -662,8 +711,8 @@ export default class Calendar extends React.Component { "react-datepicker--time-only": this.props.showTimeSelectOnly })} > - {this.renderPreviousMonthButton()} - {this.renderNextMonthButton()} + {this.renderPreviousButton()} + {this.renderNextButton()} {this.renderMonths()} {this.renderTodayButton()} {this.renderTimeSection()} diff --git a/src/index.jsx b/src/index.jsx index 84064398a..b89cd6f1e 100644 --- a/src/index.jsx +++ b/src/index.jsx @@ -158,6 +158,7 @@ export default class DatePicker extends React.Component { yearDropdownItemNumber: PropTypes.number, shouldCloseOnSelect: PropTypes.bool, showTimeInput: PropTypes.bool, + showMonthYearPicker: PropTypes.bool, showTimeSelect: PropTypes.bool, showTimeSelectOnly: PropTypes.bool, timeFormat: PropTypes.string, @@ -202,6 +203,7 @@ export default class DatePicker extends React.Component { shouldCloseOnSelect: true, showTimeSelect: false, showTimeInput: false, + showMonthYearPicker: false, strictParsing: false, timeIntervals: 30, timeCaption: "Time", @@ -254,10 +256,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(); @@ -267,8 +269,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, @@ -692,6 +694,7 @@ export default class DatePicker extends React.Component { onDayMouseEnter={this.props.onDayMouseEnter} onMonthMouseLeave={this.props.onMonthMouseLeave} showTimeInput={this.props.showTimeInput} + showMonthYearPicker={this.props.showMonthYearPicker} > {this.props.children} @@ -709,8 +712,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 => { diff --git a/src/month.jsx b/src/month.jsx index 0f3c57094..c37db46a4 100644 --- a/src/month.jsx +++ b/src/month.jsx @@ -40,7 +40,8 @@ export default class Month extends React.Component { startDate: PropTypes.instanceOf(Date), setOpen: PropTypes.func, shouldCloseOnSelect: PropTypes.bool, - renderDayContents: PropTypes.func + renderDayContents: PropTypes.func, + showMonthYearPicker: PropTypes.bool }; handleDayClick = (day, event) => { @@ -137,15 +138,53 @@ export default class Month extends React.Component { return weeks; }; + onMonthClick = (e, m) => { + this.handleDayClick( + utils.getStartOfMonth(utils.setMonth(this.props.day, m), e) + ); + }; + + renderMonths = () => { + const months = [[0, 1, 2], [3, 4, 5], [6, 7, 8], [9, 10, 11]]; + return months.map((month, i) => ( +
+ {month.map((m, j) => ( +
{ + this.onMonthClick(ev.target, m); + }} + className={classnames( + "react-datepicker__month-text", + `react-datepicker__month-${m}` + )} + > + {utils.getMonthShortInLocale(m, this.props.locale)} +
+ ))} +
+ )); + }; + getClassNames = () => { - const { selectingDate, selectsStart, selectsEnd } = this.props; - return classnames("react-datepicker__month", { - "react-datepicker__month--selecting-range": - selectingDate && (selectsStart || selectsEnd) - }); + const { + selectingDate, + selectsStart, + selectsEnd, + showMonthYearPicker + } = this.props; + return classnames( + "react-datepicker__month", + { + "react-datepicker__month--selecting-range": + selectingDate && (selectsStart || selectsEnd) + }, + { "react-datepicker__monthPicker": showMonthYearPicker } + ); }; render() { + const { showMonthYearPicker } = this.props; return (
- {this.renderWeeks()} + {showMonthYearPicker ? this.renderMonths() : this.renderWeeks()}
); } diff --git a/src/stylesheets/datepicker.scss b/src/stylesheets/datepicker.scss index d272ef244..604e629b5 100644 --- a/src/stylesheets/datepicker.scss +++ b/src/stylesheets/datepicker.scss @@ -104,7 +104,8 @@ } .react-datepicker__current-month, -.react-datepicker-time__header { +.react-datepicker-time__header, +.react-datepicker-year-header { margin-top: 0; color: $datepicker__header-color; font-weight: bold; @@ -200,6 +201,10 @@ .react-datepicker__month { margin: $datepicker__margin; text-align: center; + .react-datepicker__month-text { + display: inline-block; + width: 4rem; + } } .react-datepicker__input-time-container { @@ -329,7 +334,8 @@ margin: $datepicker__day-margin; } -.react-datepicker__day { +.react-datepicker__day, +.react-datepicker__month-text { cursor: pointer; &:hover { diff --git a/test/calendar_test.js b/test/calendar_test.js index 410b7973c..969a99c3e 100644 --- a/test/calendar_test.js +++ b/test/calendar_test.js @@ -1025,4 +1025,52 @@ describe("Calendar", function() { expect(timeInputClassname).to.have.length(1); }); }); + + describe("when showMonthYearPicker is enabled", () => { + let calendar = mount( + {}} + onClickOutside={() => {}} + hideCalendar={() => {}} + showMonthYearPicker + /> + ); + it("should change the next and previous labels", () => { + const previous = calendar.find(".react-datepicker__navigation--previous"); + const next = calendar.find(".react-datepicker__navigation--next"); + expect(previous.text()).to.equal("Previous Year"); + expect(next.text()).to.equal("Next Year"); + }); + + it("calls decreaseYear when previous month button clicked", () => { + var calendar = TestUtils.renderIntoDocument( + {}} + onClickOutside={() => {}} + showMonthYearPicker + /> + ); + calendar.state.date = utils.parseDate("09/28/1993", DATE_FORMAT); + var decreaseYear = calendar.decreaseYear; + decreaseYear(); + assert.equal(utils.getYear(calendar.state.date), 1992); + }); + + it("calls increaseYear when next month button clicked", () => { + var calendar = TestUtils.renderIntoDocument( + {}} + onClickOutside={() => {}} + showMonthYearPicker + /> + ); + calendar.state.date = utils.parseDate("09/28/1993", DATE_FORMAT); + var increaseYear = calendar.increaseYear; + increaseYear(); + assert.equal(utils.getYear(calendar.state.date), 1994); + }); + }); }); diff --git a/test/month_test.js b/test/month_test.js index 2d53b313e..144a8b3cf 100644 --- a/test/month_test.js +++ b/test/month_test.js @@ -16,7 +16,7 @@ describe("Month", () => { const expectedDay = utils.addDays(start, offset); assert( utils.isSameDay(day.props.day, expectedDay), - `Day ${(offset % 7) + 1} ` + + `Day ${offset % 7 + 1} ` + `of week ${Math.floor(offset / 7) + 1} ` + `should be "${utils.formatDate(expectedDay, "yyyy-MM-dd")}" ` + `but it is "${utils.formatDate(day.props.day, "yyyy-MM-dd")}"` @@ -146,4 +146,25 @@ describe("Month", () => { day.simulate("click"); expect(orderValueMatched).to.be.true; }); + + it("should have the month picker CSS class", () => { + const month = shallow(); + expect(month.hasClass("react-datepicker__monthPicker")).to.equal(true); + }); + + it("should call the provided onMonthClick function", () => { + let monthClicked = null; + + function onDayClick(day) { + monthClicked = day; + } + + const monthStart = utils.newDate("2015-12-01"); + const monthComponent = mount( + + ); + const month = monthComponent.find(".react-datepicker__month-text").at(6); + month.simulate("click"); + expect(utils.getMonth(monthClicked)).to.be.equal(6); + }); });