@wernfried/daterangepicker 5.3.8 → 5.4.2

package/README.md

@@ -19,8 +19,8 @@ Above samples are based on the [original repository](https://github.com/dangross
 #### Global import with `<script>` tags
 ```html
 <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/@wernfried/daterangepicker@5.3.8/dist/global/daterangepicker.min.js"></script>
-<link type="text/css" href="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.3.8/css/daterangepicker.min.css" rel="stylesheet" />
+<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.4.2/dist/global/daterangepicker.min.js"></script>
+<link type="text/css" href="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.4.2/css/daterangepicker.min.css" rel="stylesheet" />
 
 <input type="text" id="picker" />
 
@@ -40,11 +40,11 @@ Above samples are based on the [original repository](https://github.com/dangross
 {
    "imports": {
       "luxon": "https://cdn.jsdelivr.net/npm/luxon@3.7.2/+esm",
-      "daterangepicker": "https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.3.8/+esm"
+      "daterangepicker": "https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.4.2/+esm"
    }
 }
 </script>
-<link type="text/css" href="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.3.8/css/daterangepicker.min.css" rel="stylesheet" />
+<link type="text/css" href="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.4.2/css/daterangepicker.min.css" rel="stylesheet" />
 
 <input type="text" id="picker" />
 
@@ -63,9 +63,9 @@ Above samples are based on the [original repository](https://github.com/dangross
 #### Style with Bulma
 ```html
 <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/@wernfried/daterangepicker@5.3.8/dist/global/daterangepicker.min.js"></script>
+<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.4.2/dist/global/daterangepicker.min.js"></script>
 <link type="text/css" href="https://cdn.jsdelivr.net/npm/bulma@1.0.4/css/bulma.min.css" rel="stylesheet" />
-<link type="text/css" href="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.3.8/css/daterangepicker.bulma.min.css" rel="stylesheet" />
+<link type="text/css" href="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.4.2/css/daterangepicker.bulma.min.css" rel="stylesheet" />
 
 <input type="text" id="picker" />
 
@@ -121,8 +121,8 @@ Initialisation with jQuery is supported in version 5.x
 ```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/@wernfried/daterangepicker@5.3.8/dist/global/daterangepicker.min.js"></script>
-<link type="text/css" href="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.3.8/css/daterangepicker.min.css" rel="stylesheet" />
+<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.4.2/dist/global/daterangepicker.min.js"></script>
+<link type="text/css" href="https://cdn.jsdelivr.net/npm/@wernfried/daterangepicker@5.4.2/css/daterangepicker.min.css" rel="stylesheet" />
 
 <input type="text" id="picker" />
 

package/dist/cjs/daterangepicker.cjs

@@ -6,7 +6,7 @@ class DateRangePicker {
   constructor(element, options, cb) {
     if (typeof element === "string" && document.querySelectorAll(element).length > 1)
       throw new RangeError(`Option 'element' must match to one element only`);
-    this.parentEl = "body";
+    this.parentEl = document.querySelector("body");
     this.element = element instanceof HTMLElement ? element : document.querySelector(element);
     this.isInputText = this.element instanceof HTMLInputElement && this.element.type === "text";
     this.button = null;
@@ -161,7 +161,11 @@ class DateRangePicker {
       options.template = template.join("");
       this.container = createElementFromHTML(options.template);
     }
-    this.parentEl = document.querySelector(typeof options.parentEl === "string" ? options.parentEl : this.parentEl);
+    if (options.parentEl instanceof HTMLElement) {
+      this.parentEl = options.parentEl;
+    } else if (typeof options.parentEl === "string") {
+      this.parentEl = document.querySelector(options.parentEl) ?? this.parentEl;
+    }
     this.parentEl.appendChild(this.container);
     if (typeof options.timePicker === "boolean")
       this.timePicker = options.timePicker;
@@ -315,12 +319,12 @@ class DateRangePicker {
       if (opt === "endDate" && this.singleDatePicker)
         continue;
       if (typeof options[opt] === "object") {
-        if (luxon.DateTime.isDateTime(options[opt]) && options[opt].isValid) {
+        if (options[opt] == null) {
+          this[opt] = null;
+        } else if (luxon.DateTime.isDateTime(options[opt])) {
           this[opt] = options[opt];
         } else if (options[opt] instanceof Date) {
           this[opt] = luxon.DateTime.fromJSDate(options[opt]);
-        } else if (options[opt] === null) {
-          this[opt] = null;
         } else {
           console.error(`Option '${opt}' must be a luxon.DateTime or Date or string`);
         }
@@ -617,7 +621,7 @@ class DateRangePicker {
     * // -> Calendar selects and shows "today - 3 days"
     */
     onViolate: { type: "violate", param: (violation, newDate) => {
-      return { ...violation, ...{ cancelable: true } };
+      return { ...violation, cancelable: true };
     } },
     /**
     * Emitted before the calendar time picker is rendered.
@@ -1335,7 +1339,7 @@ class DateRangePicker {
       html += `<th class="week">${this.locale.weekLabel}</th>`;
     for (let [index, dayOfWeek] of this.locale.daysOfWeek.entries()) {
       html += "<th";
-      if (this.weekendDayClasses && this.weekendDayClasses.length && luxon.Info.getWeekendWeekdays().includes(index + 1))
+      if (this.weekendDayClasses && this.weekendDayClasses.length && luxon.Info.getWeekendWeekdays().includes(calendar[0][index].weekday))
         html += ` class="${this.weekendDayClasses}"`;
       html += `>${dayOfWeek}</th>`;
     }