daterangepicker-4.x 4.9.4 → 4.9.6

package/README.md

@@ -18,8 +18,8 @@ Above samples are based on the [original repository](https://github.com/dangross
 ```html
 <script type="text/javascript" src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script>
 <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/luxon@3.5.0/build/global/luxon.min.js"></script>
-<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker-4.x@4.9.4/daterangepicker.min.js"></script>
-<link type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker-4.x@4.9.4/daterangepicker.min.css" rel="stylesheet" />
+<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker-4.x@4.9.6/daterangepicker.min.js"></script>
+<link type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker-4.x@4.9.6/daterangepicker.min.css" rel="stylesheet" />
 
 <input type="text" id="daterange" />
 
@@ -608,7 +608,7 @@ Options for DateRangePicker
 | initalMonth | [<code>DateTime</code>](https://moment.github.io/luxon/api-docs/index.html#datetime) \| [<code>Date</code>](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date) \| <code>string</code> \| <code>null</code> |  | Default: `DateTime.now().startOf('month')`<br/> The inital month shown when `startDate: null`. Be aware, the attached `<input>` element must be also empty.<br/> Must be a `luxon.DateTime` or `Date` or `string` according to [ISO-8601](https://en.wikipedia.org/wiki/ISO_8601) or a string matching `locale.format`.<br/> When `initalMonth` is used, then `endDate` is ignored and it works only with `timePicker: false` |
 | autoApply | <code>boolean</code> | <code>false</code> | Hide the `Apply` and `Cancel` buttons, and automatically apply a new date range as soon as two dates are clicked.<br/> Only useful when `timePicker: false` |
 | singleDatePicker | <code>boolean</code> | <code>false</code> | Show only a single calendar to choose one date, instead of a range picker with two calendars.<br/> The start and end dates provided to your callback will be the same single date chosen. |
-| singleMonthView | <code>boolean</code> | <code>false</code> | Show only a single month calendar, useful when typically selected ranges are rather short.<br/> Ignored for `singleDatePicker: true`. |
+| singleMonthView | <code>boolean</code> | <code>false</code> | Show only a single month calendar, useful when selected ranges are usually short<br/> or for smaller viewports like mobile devices.<br/> Ignored for `singleDatePicker: true`. |
 | showDropdowns | <code>boolean</code> | <code>false</code> | Show year and month select boxes above calendars to jump to a specific month and year |
 | minYear | <code>number</code> |  | Default: `DateTime.now().minus({year:100}).year`<br/>The minimum year shown in the dropdowns when `showDropdowns: true` |
 | maxYear | <code>number</code> |  | Default: `DateTime.now().plus({year:100}).year`<br/>The maximum  year shown in the dropdowns when `showDropdowns: true` |

package/daterangepicker.js

@@ -70,7 +70,8 @@
         * Only useful when `timePicker: false`
         * @property {boolean} singleDatePicker=false - Show only a single calendar to choose one date, instead of a range picker with two calendars.<br/>
         * The start and end dates provided to your callback will be the same single date chosen.
-        * @property {boolean} singleMonthView=false - Show only a single month calendar, useful when typically selected ranges are rather short.<br/>
+        * @property {boolean} singleMonthView=false - Show only a single month calendar, useful when selected ranges are usually short<br/>
+        * or for smaller viewports like mobile devices.<br/>
         * Ignored for `singleDatePicker: true`. 
         * @property {boolean} showDropdowns=false - Show year and month select boxes above calendars to jump to a specific month and year
         * @property {number} minYear - Default: `DateTime.now().minus({year:100}).year`<br/>The minimum year shown in the dropdowns when `showDropdowns: true`
@@ -453,7 +454,7 @@
         }
 
         for (let opt of ['startDate', 'endDate', 'minDate', 'maxDate', 'initalMonth']) {
-            if (opt == 'endDate' && this.singleDatePicker)
+            if (opt === 'endDate' && this.singleDatePicker)
                 continue;
             if (typeof options[opt] === 'object') {
                 if (options[opt] instanceof DateTime && options[opt].isValid) {
@@ -492,7 +493,7 @@
                 if (val != '') {
                     const split = val.split(this.locale.separator);
                     const format = typeof this.locale.format === 'string' ? this.locale.format : DateTime.parseFormatForOpts(this.locale.format);
-                    if (split.length == 2) {
+                    if (split.length === 2) {
                         start = DateTime.fromFormat(split[0], format, { locale: DateTime.now().locale });
                         end = DateTime.fromFormat(split[1], format, { locale: DateTime.now().locale });
                     } else if (this.singleDatePicker) {
@@ -525,7 +526,7 @@
         if (['object', 'string'].includes(typeof options.altInput) && options.altInput != null) {
             if (this.singleDatePicker && typeof options.altInput === 'string') {
                 this.altInput = options.altInput
-            } else if (!this.singleDatePicker && Array.isArray(options.altInput) && options.altInput.length == 2) {
+            } else if (!this.singleDatePicker && Array.isArray(options.altInput) && options.altInput.length === 2) {
                 this.altInput = options.altInput;
             }
         }
@@ -978,7 +979,7 @@
                 }
             }
 
-            if (result.startDate.modified.length == 0)
+            if (result.startDate.modified.length === 0)
                 delete result.startDate.modified;
 
             if (this.singleDatePicker) {
@@ -1090,7 +1091,7 @@
                 }
             }
 
-            if (result.endDate.modified.length == 0)
+            if (result.endDate.modified.length === 0)
                 delete result.endDate.modified;
 
             if (range === undefined) {
@@ -1263,13 +1264,13 @@
         * @private
         */
         renderCalendar: function (side) {
-            if (side == 'right' && this.singleMonthView)
+            if (side === 'right' && this.singleMonthView)
                 return;
 
             //
             // Build the matrix of dates that will populate the calendar
             //
-            var calendar = side == 'left' ? this.leftCalendar : this.rightCalendar;
+            var calendar = side === 'left' ? this.leftCalendar : this.rightCalendar;
             if (calendar.month == null && !this.startDate && this.initalMonth)
                 calendar.month = this.initalMonth.startOf('month');
 
@@ -1297,7 +1298,7 @@
             }
 
             //make the calendar object available to hoverDate/clickDate
-            if (side == 'left') {
+            if (side === 'left') {
                 this.leftCalendar.calendar = calendar;
             } else {
                 this.rightCalendar.calendar = calendar;
@@ -1307,10 +1308,10 @@
             // Display the calendar
             //
 
-            var minDate = side == 'left' ? this.minDate : this.startDate;
+            var minDate = side === 'left' ? this.minDate : this.startDate;
             var maxDate = this.maxDate;
-            var selected = side == 'left' ? this.startDate : this.endDate;
-            var arrow = this.locale.direction == 'ltr' ? { left: 'chevron-left', right: 'chevron-right' } : { left: 'chevron-right', right: 'chevron-left' };
+            var selected = side === 'left' ? this.startDate : this.endDate;
+            var arrow = this.locale.direction === 'ltr' ? { left: 'chevron-left', right: 'chevron-right' } : { left: 'chevron-right', right: 'chevron-left' };
 
             var html = '<table class="table-condensed">';
             html += '<thead>';
@@ -1320,7 +1321,7 @@
             if (this.showWeekNumbers || this.showISOWeekNumbers)
                 html += '<th></th>';
 
-            if ((!minDate || minDate < calendar.firstDay) && (!this.linkedCalendars || side == 'left')) {
+            if ((!minDate || minDate < calendar.firstDay) && (!this.linkedCalendars || side === 'left')) {
                 html += '<th class="prev available"><span></span></th>';
             } else {
                 html += '<th></th>';
@@ -1350,7 +1351,7 @@
             }
 
             html += '<th colspan="5" class="month">' + dateHtml + '</th>';
-            if ((!maxDate || maxDate > calendar.lastDay.endOf('day')) && (!this.linkedCalendars || side == 'right' || this.singleDatePicker || this.singleMonthView)) {
+            if ((!maxDate || maxDate > calendar.lastDay.endOf('day')) && (!this.linkedCalendars || side === 'right' || this.singleDatePicker || this.singleMonthView)) {
                 html += '<th class="next available"><span></span></th>';
             } else {
                 html += '<th></th>';
@@ -1483,7 +1484,7 @@
 
             // Don't bother updating the time picker if it's currently disabled
             // because an end date hasn't been clicked yet
-            if (side == 'end' && !this.endDate) return;
+            if (side === 'end' && !this.endDate) return;
 
             var selected, minLimit, minDate, maxDate = this.maxDate;
             let html = '';
@@ -1491,13 +1492,13 @@
             if (this.maxSpan && (!this.maxDate || this.startDate.plus(this.maxSpan) < this.maxDate))
                 maxDate = this.startDate.plus(this.maxSpan);
 
-            if (this.minSpan && side == 'end')
+            if (this.minSpan && side === 'end')
                 minLimit = this.startDate.plus(this.minSpan);
 
-            if (side == 'start') {
+            if (side === 'start') {
                 selected = this.startDate;
                 minDate = this.minDate;
-            } else if (side == 'end') {
+            } else if (side === 'end') {
                 selected = this.endDate;
                 minDate = this.startDate;
 
@@ -1523,13 +1524,13 @@
             //
 
             //if (this.singleMonthView) // to do: localization options
-            //    html = `<span style="font-family: arial; font-size: 12px;">${side == 'start' ? 'Start' : 'End'}: </span>`;
+            //    html = `<span style="font-family: arial; font-size: 12px;">${side === 'start' ? 'Start' : 'End'}: </span>`;
 
             html += '<select class="hourselect">';
             const ampm = selected.toFormat('a', { locale: 'en-US' });
             let start = 0;
             if (!this.timePicker24Hour)
-                start = ampm == 'AM' ? 1 : 13;
+                start = ampm === 'AM' ? 1 : 13;
 
             for (var i = start; i <= start + 23; i += this.timePickerOpts.hourStep) {
                 let time = selected.set({ hour: i % 24 });
@@ -1658,7 +1659,7 @@
                     pm_html = ' disabled="disabled" class="disabled"';
                 } else {
                     if (this.isInvalidTime(selected, this.singleDatePicker ? null : side, 'ampm')) {
-                        if (selected.toFormat('a', { locale: 'en-US' }) == 'AM') {
+                        if (selected.toFormat('a', { locale: 'en-US' }) === 'AM') {
                             pm_html = ' disabled="disabled" class="disabled"';
                         } else {
                             am_html = ' disabled="disabled" class="disabled"';
@@ -1667,10 +1668,10 @@
                 }
 
                 html += `<option value="AM"${am_html}`;
-                if (selected.toFormat('a', { locale: 'en-US' }) == 'AM')
+                if (selected.toFormat('a', { locale: 'en-US' }) === 'AM')
                     html += ' selected="selected"';
                 html += `>${Info.meridiems()[0]}</option><option value="PM"${pm_html}`;
-                if (selected.toFormat('a', { locale: 'en-US' }) == 'PM')
+                if (selected.toFormat('a', { locale: 'en-US' }) === 'PM')
                     html += ' selected="selected"';
                 html += `>${Info.meridiems()[1]}</option>`;
 
@@ -1736,9 +1737,9 @@
             });
             var containerWidth = this.container.outerWidth();
 
-            this.container.toggleClass('drop-up', drops == 'up');
+            this.container.toggleClass('drop-up', drops === 'up');
 
-            if (this.opens == 'left') {
+            if (this.opens === 'left') {
                 var containerRight = parentRightEdge - this.element.offset().left - this.element.outerWidth();
                 if (containerWidth + containerRight > $(window).width()) {
                     this.container.css({
@@ -1753,7 +1754,7 @@
                         left: 'auto'
                     });
                 }
-            } else if (this.opens == 'center') {
+            } else if (this.opens === 'center') {
                 var containerLeft = this.element.offset().left - parentOffset.left + this.element.outerWidth() / 2 - containerWidth / 2;
                 if (containerLeft < 0) {
                     this.container.css({
@@ -1904,13 +1905,13 @@
             // itself then call this.hide()
             if (
                 // ie modal dialog fix
-                e.type == "focusin" ||
+                e.type === "focusin" ||
                 target.closest(this.element).length ||
                 target.closest(this.container).length ||
                 target.closest('.calendar-table').length
             ) return;
 
-            if (this.onOutsideClick == 'cancel') {
+            if (this.onOutsideClick === 'cancel') {
                 this.startDate = this.oldStartDate;
                 this.endDate = this.oldEndDate;
             }
@@ -2244,7 +2245,7 @@
                         unit = 'second';
                     }
                 }
-                if (this.startDate.startOf(unit) == this.ranges[range][0].startOf(unit) == this.endDate.startOf(unit) == this.ranges[range][1].startOf(unit)) {
+                if (this.startDate.startOf(unit).equals(this.ranges[range][0].startOf(unit)) && this.endDate.startOf(unit).equals(this.ranges[range][1].startOf(unit))) {
                     customRange = false;
                     this.chosenLabel = this.container.find('.ranges li:eq(' + i + ')').addClass('active').attr('data-range-key');
                     break;
@@ -2386,7 +2387,7 @@
                     second = parseInt(time.find('.secondselect option:last').val(), 10);
             }
 
-            if (side == 'start') {
+            if (side === 'start') {
                 if (this.startDate) {
                     let start = this.startDate.set({ hour: hour, minute: minute, second: second });
                     this.setStartDate(start, true);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "daterangepicker-4.x",
-  "version": "4.9.4",
+  "version": "4.9.6",
   "description": "Date range picker with time component and pre-defined ranges",
   "main": "daterangepicker.js",
   "style": "daterangepicker.css",