@coreui/coreui-pro - npm Package Compare versions

Comparing version 4.2.0-rc.0 to 4.2.0-rc.1

js/dist/alert.js

 /*!
-  * CoreUI alert.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI alert.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -19,3 +19,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -149,3 +149,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -152,0 +152,0 @@ *

js/dist/base-component.js

 /*!
-  * CoreUI base-component.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI base-component.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -19,3 +19,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -120,3 +120,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -134,3 +134,3 @@ *
 
-  const VERSION = '4.2.0-rc.0';
+  const VERSION = '4.2.0-rc.1';
 
@@ -137,0 +137,0 @@ class BaseComponent {

js/dist/button.js

 /*!
-  * CoreUI button.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI button.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -19,3 +19,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -78,3 +78,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -81,0 +81,0 @@ *

js/dist/carousel.js

 /*!
-  * CoreUI carousel.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI carousel.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -21,3 +21,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -217,3 +217,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): carousel.js
+   * CoreUI (v4.2.0-rc.1): carousel.js
    * Licensed under MIT (https://coreui.io/license)
@@ -220,0 +220,0 @@ *

js/dist/collapse.js

 /*!
-  * CoreUI collapse.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI collapse.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -22,3 +22,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -179,3 +179,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): collapse.js
+   * CoreUI (v4.2.0-rc.1): collapse.js
    * Licensed under MIT (https://coreui.io/license)
@@ -182,0 +182,0 @@ *

js/dist/dom/data.js

 /*!
-  * CoreUI data.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI data.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -14,3 +14,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): dom/data.js
+   * CoreUI (v4.2.0-rc.1): dom/data.js
    * Licensed under MIT (https://coreui.io/license)
@@ -17,0 +17,0 @@ *

js/dist/dom/event-handler.js

 /*!
-  * CoreUI event-handler.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI event-handler.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -14,3 +14,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -37,3 +37,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): dom/event-handler.js
+   * CoreUI (v4.2.0-rc.1): dom/event-handler.js
    * Licensed under MIT (https://coreui.io/license)
@@ -40,0 +40,0 @@ *

js/dist/dom/manipulator.js

 /*!
-  * CoreUI manipulator.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI manipulator.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -14,3 +14,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): dom/manipulator.js
+   * CoreUI (v4.2.0-rc.1): dom/manipulator.js
    * Licensed under MIT (https://coreui.io/license)
@@ -17,0 +17,0 @@ *

js/dist/dom/selector-engine.js

 /*!
-  * CoreUI selector-engine.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI selector-engine.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -14,3 +14,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -81,3 +81,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): dom/selector-engine.js
+   * CoreUI (v4.2.0-rc.1): dom/selector-engine.js
    * Licensed under MIT (https://coreui.io/license)
@@ -84,0 +84,0 @@ *

js/dist/dropdown.js

 /*!
-  * CoreUI dropdown.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI dropdown.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -40,3 +40,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -248,3 +248,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): dropdown.js
+   * CoreUI (v4.2.0-rc.1): dropdown.js
    * Licensed under MIT (https://coreui.io/license)
@@ -251,0 +251,0 @@ *

js/dist/modal.js

 /*!
-  * CoreUI modal.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI modal.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -21,3 +21,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -636,3 +636,3 @@ *
    * --------------------------------------------------------------------------
-    * CoreUI (v4.2.0-rc.0): modal.js
+    * CoreUI (v4.2.0-rc.1): modal.js
    * Licensed under MIT (https://coreui.io/license)
@@ -639,0 +639,0 @@ *

js/dist/offcanvas.js

 /*!
-  * CoreUI offcanvas.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI offcanvas.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -21,3 +21,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -634,3 +634,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): dropdown.js
+   * CoreUI (v4.2.0-rc.1): dropdown.js
    * Licensed under MIT (https://coreui.io/license)
@@ -637,0 +637,0 @@ *

js/dist/popover.js

 /*!
-  * CoreUI popover.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI popover.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -18,3 +18,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -77,3 +77,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): popover.js
+   * CoreUI (v4.2.0-rc.1): popover.js
    * Licensed under MIT (https://coreui.io/license)
@@ -80,0 +80,0 @@ *

js/dist/scrollspy.js

 /*!
-  * CoreUI scrollspy.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI scrollspy.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -21,3 +21,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -159,3 +159,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): scrollspy.js
+   * CoreUI (v4.2.0-rc.1): scrollspy.js
    * Licensed under MIT (https://coreui.io/license)
@@ -162,0 +162,0 @@ *

js/dist/tab.js

 /*!
-  * CoreUI tab.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI tab.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -20,3 +20,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -138,3 +138,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): tab.js
+   * CoreUI (v4.2.0-rc.1): tab.js
    * Licensed under MIT (https://coreui.io/license)
@@ -141,0 +141,0 @@ *

js/dist/toast.js

 /*!
-  * CoreUI toast.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI toast.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -20,3 +20,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -196,3 +196,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): toast.js
+   * CoreUI (v4.2.0-rc.1): toast.js
    * Licensed under MIT (https://coreui.io/license)
@@ -199,0 +199,0 @@ *

js/dist/tooltip.js

 /*!
-  * CoreUI tooltip.js v4.2.0-rc.0 (https://coreui.io)
+  * CoreUI tooltip.js v4.2.0-rc.1 (https://coreui.io)
   * Copyright 2022 The CoreUI Team (https://github.com/orgs/coreui/people)
@@ -41,3 +41,3 @@ * Licensed under MIT (https://coreui.io)
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -187,3 +187,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): alert.js
+   * CoreUI (v4.2.0-rc.1): alert.js
    * Licensed under MIT (https://coreui.io/license)
@@ -303,3 +303,3 @@ *
    * --------------------------------------------------------------------------
-   * CoreUI (v4.2.0-rc.0): tooltip.js
+   * CoreUI (v4.2.0-rc.1): tooltip.js
    * Licensed under MIT (https://coreui.io/license)
@@ -306,0 +306,0 @@ *

js/src/alert.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): alert.js
+ * CoreUI (v4.2.0-rc.1): alert.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/base-component.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): alert.js
+ * CoreUI (v4.2.0-rc.1): alert.js
  * Licensed under MIT (https://coreui.io/license)
@@ -24,3 +24,3 @@ *
 
-const VERSION = '4.2.0-rc.0'
+const VERSION = '4.2.0-rc.1'
 
@@ -27,0 +27,0 @@ class BaseComponent {

js/src/button.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): alert.js
+ * CoreUI (v4.2.0-rc.1): alert.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/calendar.js

 /* eslint-disable indent, multiline-ternary */
 /**
  * --------------------------------------------------------------------------
- * CoreUI PRO (v4.2.0-rc.0): calendar.js
+ * CoreUI PRO (v4.2.0-rc.1): calendar.js
  * License (https://coreui.io/pro/license-new/)
@@ -52,2 +52,3 @@ * --------------------------------------------------------------------------
   calendarDate: new Date(),
+  calendars: 1,
   disabledDates: null,
@@ -67,2 +68,3 @@ endDate: null,
   calendarDate: '(date|string|null)',
+  calendars: 'number',
   disabledDates: '(array|null)',
@@ -94,4 +96,6 @@ endDate: '(date|string|null)',
     this._endDate = this._config.endDate
+    this._hoverDate = null
     this._selectEndDate = this._config.selectEndDate
     this._view = 'days'
+
     this._createCalendar()
@@ -141,2 +145,4 @@ this._addEventListeners()
 
+      this._hoverDate = new Date(Manipulator.getDataAttribute(event.target, 'date'))
+
       EventHandler.trigger(this._element, EVENT_CELL_HOVER, {
@@ -149,2 +155,5 @@ date: new Date(Manipulator.getDataAttribute(event.target, 'date'))
       event.preventDefault()
+
+      this._hoverDate = null
+
       EventHandler.trigger(this._element, EVENT_CELL_HOVER, {
@@ -180,3 +189,3 @@ date: null
       this._element.innerHTML = ''
-      this._createCalendar()
+      this._createCalendarPanel()
     })
@@ -188,3 +197,3 @@
       this._element.innerHTML = ''
-      this._createCalendar()
+      this._createCalendarPanel()
     })
@@ -262,7 +271,15 @@ }
 
-  _createCalendar() {
-    const { firstDayOfWeek, locale, weekdayFormat } = this._config
-    const year = this._calendarDate.getFullYear()
-    const month = this._calendarDate.getMonth()
+  _createCalendarPanel(addMonths) {
+    let date = this._calendarDate
 
+    if (addMonths !== 0) {
+      date = new Date(this._calendarDate.getFullYear(), this._calendarDate.getMonth() + addMonths, 1)
+    }
+
+    const year = date.getFullYear()
+    const month = date.getMonth()
+
+    const calendarPanelEl = document.createElement('div')
+    calendarPanelEl.classList.add('calendar-panel')
+
     // Create navigation
@@ -282,6 +299,6 @@ const navigationElement = document.createElement('div')
         <button class="btn btn-transparent btn-sm btn-month">
-          ${this._calendarDate.toLocaleDateString(locale, { month: 'long' })}
+          ${date.toLocaleDateString(this._config.locale, { month: 'long' })}
         </button>
         <button class="btn btn-transparent btn-sm btn-year">
-          ${this._calendarDate.toLocaleDateString(locale, { year: 'numeric' })}
+          ${date.toLocaleDateString(this._config.locale, { year: 'numeric' })}
         </button>
@@ -299,5 +316,5 @@ </div>
 
-    const monthDetails = getMonthDetails(year, month, firstDayOfWeek)
-    const listOfMonths = createGroupsInArray(getMonthsNames(locale), 4)
-    const listOfYears = createGroupsInArray(getYears(this._calendarDate.getFullYear()), 4)
+    const monthDetails = getMonthDetails(year, month, this._config.firstDayOfWeek)
+    const listOfMonths = createGroupsInArray(getMonthsNames(this._config.locale), 4)
+    const listOfYears = createGroupsInArray(getYears(date.getFullYear()), 4)
     const weekDays = monthDetails[0]
@@ -313,7 +330,7 @@
               <div class="calendar-header-cell-inner">
-              ${typeof weekdayFormat === 'string' ?
-              date.toLocaleDateString(locale, { weekday: weekdayFormat }) :
+              ${typeof this._config.weekdayFormat === 'string' ?
+              date.toLocaleDateString(this._config.locale, { weekday: this._config.weekdayFormat }) :
               date
-                  .toLocaleDateString(locale, { weekday: 'long' })
-                  .slice(0, weekdayFormat)}
+                  .toLocaleDateString(this._config.locale, { weekday: 'long' })
+                  .slice(0, this._config.weekdayFormat)}
               </div>
@@ -329,3 +346,3 @@ </th>`
               <div class="calendar-cell-inner day" data-coreui-date="${date}">
-                ${date.toLocaleDateString(locale, { day: 'numeric' })}
+                ${date.toLocaleDateString(this._config.locale, { day: 'numeric' })}
               </div>
@@ -355,5 +372,16 @@ </td>`
     `
+    calendarPanelEl.append(navigationElement, calendarTable)
 
+    return calendarPanelEl
+  }
+
+  _createCalendar() {
+    const calendarsEl = document.createElement('div')
+    calendarsEl.classList.add('calendars')
+    Array.from({ length: this._config.calendars }).forEach((_, index) => (
+      calendarsEl.append(this._createCalendarPanel(index))
+    ))
+
     this._element.classList.add(CLASS_NAME_CALENDAR)
-    this._element.append(navigationElement, calendarTable)
+    this._element.append(calendarsEl)
   }
@@ -363,17 +391,28 @@
     this._element.innerHTML = ''
-    this._createCalendar()
+    this._createCalendarPanel()
   }
 
   _dayClassNames(date, month) {
-    const classNames = [
-      isToday(date) && 'today',
-      isDateDisabled(date, this._config.minDate, this._config.maxDate, this._config.disabledDates) && 'disabled',
-      `${month}`,
-      isLastDayOfMonth(date) && 'last',
-      month === 'current' && isDateInRange(date, this._startDate, this._endDate) && 'range',
-      isDateSelected(date, this._startDate, this._endDate) && 'selected',
-      isStartDate(date, this._startDate, this._endDate) && 'start',
-      isEndDate(date, this._startDate, this._endDate) && 'end'
-    ]
-    return classNames.filter(Boolean).join(' ')
+    const classNames = {
+      today: isToday(date),
+      disabled: isDateDisabled(date, this._config.minDate, this._config.maxDate, this._config.disabledDates),
+      [month]: true,
+      last: isLastDayOfMonth(date),
+      range: month === 'current' && isDateInRange(date, this._startDate, this._endDate),
+      'range-hover': month === 'current' && (this._hoverDate && this._selectEndDate ?
+        isDateInRange(date, this._startDate, this._hoverDate) :
+        isDateInRange(date, this._hoverDate, this._endDate)),
+      selected: isDateSelected(date, this._startDate, this._endDate),
+      start: isStartDate(date, this._startDate, this._endDate),
+      end: isEndDate(date, this._startDate, this._endDate)
+    }
+
+    // eslint-disable-next-line unicorn/no-array-reduce, unicorn/prefer-object-from-entries
+    const result = Object.keys(classNames).reduce((o, key) => {
+      // eslint-disable-next-line no-unused-expressions
+      classNames[key] === true && (o[key] = classNames[key])
+      return o
+    }, {})
+
+    return Object.keys(result).join(' ')
   }
@@ -380,0 +419,0 @@

js/src/carousel.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): carousel.js
+ * CoreUI (v4.2.0-rc.1): carousel.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/collapse.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): collapse.js
+ * CoreUI (v4.2.0-rc.1): collapse.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/date-picker.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI PRO (v4.2.0-rc.0): date-picker.js
+ * CoreUI PRO (v4.2.0-rc.1): date-picker.js
  * License (https://coreui.io/pro/license-new/)
@@ -75,3 +75,4 @@ * --------------------------------------------------------------------------
         EventHandler.trigger(this._element, EVENT_DATE_CHANGE, {
-          date: event.date
+          date: event.date,
+          formatedDate: event.date ? this._formatDate(event.date) : undefined
         })
@@ -78,0 +79,0 @@ })

js/src/date-range-picker.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI PRO (v4.2.0-rc.0): date-range-picker.js
+ * CoreUI PRO (v4.2.0-rc.1): date-range-picker.js
  * License (https://coreui.io/pro/license-new/)
@@ -8,2 +8,4 @@ * --------------------------------------------------------------------------
 
+import { format as dateFormat, parseISO } from 'date-fns'
+
 import { defineJQueryPlugin, typeCheckConfig } from './util/index'
@@ -45,2 +47,3 @@ import EventHandler from './dom/event-handler'
   firstDayOfWeek: 1,
+  format: null,
   indicator: true,
@@ -58,3 +61,5 @@ locale: 'default',
   selectEndDate: false,
-  timepicker: false
+  timepicker: false,
+  todayButton: 'Today',
+  todayButtonClasses: ['btn', 'btn-sm', 'btn-primary', 'me-auto']
 }
@@ -72,2 +77,3 @@
   firstDayOfWeek: 'number',
+  format: '(string|null)',
   indicator: 'boolean',
@@ -85,3 +91,5 @@ locale: 'string',
   selectEndDate: 'boolean',
-  timepicker: 'boolean'
+  timepicker: 'boolean',
+  todayButton: '(boolean|string)',
+  todayButtonClasses: '(array|string)'
 }
@@ -115,2 +123,3 @@
     this._startInput = null
+    this._timepickers = null
     this._timePickerEnd = null
@@ -147,2 +156,6 @@ this._timePickerStart = null
     this._calendars.innerHTML = ''
+    if (this._config.timepicker) {
+      this._timepickers.innerHTML = ''
+    }
+
     this._createCalendars()
@@ -158,2 +171,6 @@ this._addCalendarEventListeners()
     this._calendars.innerHTML = ''
+    if (this._config.timepicker) {
+      this._timepickers.innerHTML = ''
+    }
+
     this._createCalendars()
@@ -169,2 +186,6 @@ this._addCalendarEventListeners()
     this._calendars.innerHTML = ''
+    if (this._config.timepicker) {
+      this._timepickers.innerHTML = ''
+    }
+
     this._createCalendars()
@@ -197,3 +218,8 @@ this._addCalendarEventListeners()
     EventHandler.on(this._startInput, 'input', event => {
-      const date = getLocalDateFromString(event.target.value, this._config.locale, this._config.timepicker)
+      const date = this._config.format ?
+        parseISO(event.target.value) :
+        getLocalDateFromString(event.target.value, this._config.locale, this._config.timepicker)
+
+      // eslint-disable-next-line no-console
+      console.log(parseISO(event.target.value))
       if (date instanceof Date && date.getTime()) {
@@ -213,3 +239,5 @@ this._startDate = date
     EventHandler.on(this._endInput, 'input', event => {
-      const date = getLocalDateFromString(event.target.value, this._config.locale, this._config.timepicker)
+      const date = this._config.format ?
+        parseISO(event.target.value) :
+        getLocalDateFromString(event.target.value, this._config.locale, this._config.timepicker)
       if (date instanceof Date && date.getTime()) {
@@ -249,3 +277,4 @@ this._endDate = date
         EventHandler.trigger(this._element, EVENT_START_DATE_CHANGE, {
-          date: event.date
+          date: event.date,
+          formatedDate: event.date ? this._formatDate(event.date) : undefined
         })
@@ -265,3 +294,4 @@ })
         EventHandler.trigger(this._element, EVENT_END_DATE_CHANGE, {
-          date: event.date
+          date: event.date,
+          formatedDate: event.date ? this._formatDate(event.date) : undefined
         })
@@ -272,7 +302,7 @@ })
         if (this._selectEndDate) {
-          this._endInput.value = event.date ? event.date.toLocaleDateString(this._config.locale) : (this._endDate ? this._setInputValue(this._endDate) : '')
+          this._endInput.value = event.date ? this._formatDate(event.date) : ''
           return
         }
 
-        this._startInput.value = event.date ? event.date.toLocaleDateString(this._config.locale) : (this._startDate ? this._setInputValue(this._startDate) : '')
+        this._startInput.value = event.date ? this._formatDate(event.date) : ''
       })
@@ -291,3 +321,3 @@ })
     inputEl.placeholder = placeholder
-    inputEl.readOnly = this._config.inputReadOnly
+    inputEl.readOnly = this._config.inputReadOnly || typeof this._config.format === 'string'
     inputEl.type = 'text'
@@ -351,77 +381,76 @@ inputEl.value = value
   _createCalendars() {
-    Array.from({ length: this._mobile ? 1 : this._config.calendars }).forEach((_, index) => {
-      const calendarEl = document.createElement('div')
-      calendarEl.classList.add('date-picker-calendar')
+    const calendarEl = document.createElement('div')
+    calendarEl.classList.add('date-picker-calendar')
 
-      this._calendars.append(calendarEl)
+    this._calendars.append(calendarEl)
 
-      // eslint-disable-next-line no-new
-      new Calendar(calendarEl, {
-        calendarDate: new Date(
-          this._calendarDate.getFullYear(),
-          this._calendarDate.getMonth() + index,
-          1
-        ),
-        disabledDates: this._config.disabledDates,
-        endDate: this._endDate,
-        firstDayOfWeek: this._config.firstDayOfWeek,
-        locale: this._config.locale,
-        maxDate: this._config.maxDate,
-        minDate: this._config.minDate,
-        range: this._config.range,
-        selectEndDate: this._selectEndDate,
-        startDate: this._startDate
-      })
+    // eslint-disable-next-line no-new
+    new Calendar(calendarEl, {
+      calendarDate: new Date(
+        this._calendarDate.getFullYear(),
+        this._calendarDate.getMonth(),
+        1
+      ),
+      calendars: this._config.calendars,
+      disabledDates: this._config.disabledDates,
+      endDate: this._endDate,
+      firstDayOfWeek: this._config.firstDayOfWeek,
+      locale: this._config.locale,
+      maxDate: this._config.maxDate,
+      minDate: this._config.minDate,
+      range: this._config.range,
+      selectEndDate: this._selectEndDate,
+      startDate: this._startDate
+    })
 
-      EventHandler.one(calendarEl, 'calendarDateChange.coreui.calendar', event => {
-        this._calendarDate = new Date(
-          event.date.getFullYear(),
-          event.date.getMonth() - index,
-          1
-        )
-        this._updateCalendars()
-      })
+    EventHandler.one(calendarEl, 'calendarDateChange.coreui.calendar', event => {
+      this._calendarDate = new Date(
+        event.date.getFullYear(),
+        event.date.getMonth(),
+        1
+      )
+      this._updateCalendars()
+    })
 
-      if (this._config.timepicker) {
-        if ((this._config.calendars === 1 || this._mobile) && this._config.range) {
-          const timePickerStartEl = document.createElement('div')
-          timePickerStartEl.classList.add('time-picker')
+    if (this._config.timepicker) {
+      if (this._mobile || (this._range && this._config.calendars === 1)) {
+        const timePickerStartEl = document.createElement('div')
+        timePickerStartEl.classList.add('time-picker')
 
-          // eslint-disable-next-line no-new
-          new TimePicker(timePickerStartEl, {
-            container: 'inline',
-            disabled: !this._startDate,
-            locale: this._config.locale,
-            time: this._startDate,
-            variant: 'select'
-          })
-          calendarEl.append(timePickerStartEl)
+        // eslint-disable-next-line no-new
+        new TimePicker(timePickerStartEl, {
+          container: 'inline',
+          disabled: !this._startDate,
+          locale: this._config.locale,
+          time: this._startDate,
+          variant: 'select'
+        })
+        calendarEl.append(timePickerStartEl)
 
-          EventHandler.one(timePickerStartEl, 'timeChange.coreui.time-picker', event => {
-            this._startDate = event.date
-            this._startInput.value = this._setInputValue(this._startDate)
-            this._updateCalendars()
-          })
+        EventHandler.one(timePickerStartEl, 'timeChange.coreui.time-picker', event => {
+          this._startDate = event.date
+          this._startInput.value = this._setInputValue(this._startDate)
+          this._updateCalendars()
+        })
 
-          const timePickerEndEl = document.createElement('div')
-          timePickerEndEl.classList.add('time-picker')
+        const timePickerEndEl = document.createElement('div')
+        timePickerEndEl.classList.add('time-picker')
 
-          // eslint-disable-next-line no-new
-          new TimePicker(timePickerEndEl, {
-            container: 'inline',
-            disabled: !this._endDate,
-            locale: this._config.locale,
-            time: this._endDate,
-            variant: 'select'
-          })
-          calendarEl.append(timePickerEndEl)
+        // eslint-disable-next-line no-new
+        new TimePicker(timePickerEndEl, {
+          container: 'inline',
+          disabled: !this._endDate,
+          locale: this._config.locale,
+          time: this._endDate,
+          variant: 'select'
+        })
+        this._timepickers.append(timePickerEndEl)
 
-          EventHandler.one(timePickerEndEl, 'timeChange.coreui.time-picker', event => {
-            this._endDate = event.date
-            this._endInput.value = this._setInputValue(this._endDate)
-            this._updateCalendars()
-          })
-        }
-
-        if (!this._mobile && (index === 0 || this._config.calendars - index === 1)) {
+        EventHandler.one(timePickerEndEl, 'timeChange.coreui.time-picker', event => {
+          this._endDate = event.date
+          this._endInput.value = this._setInputValue(this._endDate)
+          this._updateCalendars()
+        })
+      } else {
+        Array.from({ length: this._config.calendars }).forEach((_, index) => {
           const timePickerEl = document.createElement('div')
@@ -438,4 +467,5 @@ timePickerEl.classList.add('time-picker')
           })
-          calendarEl.append(timePickerEl)
 
+          this._timepickers.append(timePickerEl)
+
           EventHandler.one(timePickerEl, 'timeChange.coreui.time-picker', event => {
@@ -452,7 +482,5 @@ if (index === 0) {
           })
-        }
+        })
       }
-
-      this._calendars.append(calendarEl)
-    })
+    }
   }
@@ -500,11 +528,51 @@
 
+    if (this._config.timepicker) {
+      const timepickersEl = document.createElement('div')
+      timepickersEl.classList.add('date-picker-timepickers')
+
+      this._timepickers = timepickersEl
+      dateRangePickerBodyEl.append(timepickersEl)
+    }
+
     return dateRangePickerBodyEl
   }
 
+  _createFooterContent() {
+    if (this._config.todayButton) {
+      const todayButtonEl = document.createElement('button')
+      todayButtonEl.classList.add(...this._getButtonClasses(this._config.todayButtonClasses))
+      todayButtonEl.type = 'button'
+      todayButtonEl.innerHTML = this._config.todayButton
+      todayButtonEl.addEventListener('click', () => {
+        const date = new Date()
+        this._calendarDate = date
+        this._startDate = date
+        this._endDate = date
+        this._endInput.value = this._setInputValue(date)
+        this._startInput.value = this._setInputValue(date)
+        this._updateCalendars()
+      })
+
+      return todayButtonEl
+    }
+  }
+
+  _formatDate(date) {
+    if (this._config.format) {
+      return dateFormat(date, this._config.format)
+    }
+
+    if (this._config.timepicker) {
+      return date.toLocaleString(this._config.locale)
+    }
+
+    return date.toLocaleDateString(this._config.locale)
+  }
+
   _setInputValue(date) {
-    return date ?
-      (this._config.timepicker ?
-        date.toLocaleString(this._config.locale) :
-        date.toLocaleDateString(this._config.locale)) :
-      ''
+    if (date) {
+      return this._formatDate(date)
+    }
+
+    return ''
   }
@@ -514,2 +582,6 @@
     this._calendars.innerHTML = ''
+    if (this._config.timepicker) {
+      this._timepickers.innerHTML = ''
+    }
+
     this._createCalendars()
@@ -516,0 +588,0 @@ this._addCalendarEventListeners()

js/src/dom/data.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): dom/data.js
+ * CoreUI (v4.2.0-rc.1): dom/data.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/dom/event-handler.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): dom/event-handler.js
+ * CoreUI (v4.2.0-rc.1): dom/event-handler.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/dom/manipulator.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): dom/manipulator.js
+ * CoreUI (v4.2.0-rc.1): dom/manipulator.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/dom/selector-engine.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): dom/selector-engine.js
+ * CoreUI (v4.2.0-rc.1): dom/selector-engine.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/dropdown.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): dropdown.js
+ * CoreUI (v4.2.0-rc.1): dropdown.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/loading-button.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI PRO (v4.2.0-rc.0): loading-button.js
+ * CoreUI PRO (v4.2.0-rc.1): loading-button.js
  * License (https://coreui.io/pro/license-new/)
@@ -5,0 +5,0 @@ * --------------------------------------------------------------------------

js/src/modal.js

 /**
  * --------------------------------------------------------------------------
-  * CoreUI (v4.2.0-rc.0): modal.js
+  * CoreUI (v4.2.0-rc.1): modal.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/multi-select.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI PRO (v4.2.0-rc.0): multi-select.js
+ * CoreUI PRO (v4.2.0-rc.1): multi-select.js
  * License (https://coreui.io/pro/license-new/)
@@ -5,0 +5,0 @@ * --------------------------------------------------------------------------

js/src/navigation.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): navigation.js
+ * CoreUI (v4.2.0-rc.1): navigation.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ * --------------------------------------------------------------------------

js/src/offcanvas.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): dropdown.js
+ * CoreUI (v4.2.0-rc.1): dropdown.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/picker.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI PRO (v4.2.0-rc.0): picker.js
+ * CoreUI PRO (v4.2.0-rc.1): picker.js
  * License (https://coreui.io/pro/license-new/)
@@ -27,5 +27,5 @@ * --------------------------------------------------------------------------
 const Default = {
-  cancelButtonLabel: 'Cancel',
+  cancelButton: 'Cancel',
   cancelButtonClasses: ['btn', 'btn-sm', 'btn-ghost-primary'],
-  confirmButtonLabel: 'OK',
+  confirmButton: 'OK',
   confirmButtonClasses: ['btn', 'btn-sm', 'btn-primary'],
@@ -38,5 +38,5 @@ container: 'dropdown',
 const DefaultType = {
-  cancelButtonLabel: 'string',
+  cancelButton: '(boolean|string)',
   cancelButtonClasses: '(array|string)',
-  confirmButtonLabel: 'string',
+  confirmButton: '(boolean|string)',
   confirmButtonClasses: '(array|string)',
@@ -120,23 +120,36 @@ container: 'string',
 
-    const cancelButtonEl = document.createElement('button')
-    cancelButtonEl.classList.add(...this._getButtonClasses(this._config.cancelButtonClasses))
-    cancelButtonEl.type = 'button'
-    cancelButtonEl.innerHTML = this._config.cancelButtonLabel
-    cancelButtonEl.addEventListener('click', () => {
-      this._dropdown.hide()
-      EventHandler.trigger(this._element, EVENT_CANCEL)
-    })
+    footerEl.append(this._createFooterContent())
 
-    const okButtonEl = document.createElement('button')
-    okButtonEl.classList.add(...this._getButtonClasses(this._config.confirmButtonClasses))
-    okButtonEl.type = 'button'
-    okButtonEl.innerHTML = this._config.confirmButtonLabel
-    okButtonEl.addEventListener('click', () => {
-      this._dropdown.hide()
-    })
+    if (this._config.cancelButton) {
+      const cancelButtonEl = document.createElement('button')
+      cancelButtonEl.classList.add(...this._getButtonClasses(this._config.cancelButtonClasses))
+      cancelButtonEl.type = 'button'
+      cancelButtonEl.innerHTML = this._config.cancelButton
+      cancelButtonEl.addEventListener('click', () => {
+        this._dropdown.hide()
+        EventHandler.trigger(this._element, EVENT_CANCEL)
+      })
 
-    footerEl.append(cancelButtonEl, okButtonEl)
+      footerEl.append(cancelButtonEl)
+    }
+
+    if (this._config.confirmButton) {
+      const confirmButtonEl = document.createElement('button')
+      confirmButtonEl.classList.add(...this._getButtonClasses(this._config.confirmButtonClasses))
+      confirmButtonEl.type = 'button'
+      confirmButtonEl.innerHTML = this._config.confirmButton
+      confirmButtonEl.addEventListener('click', () => {
+        this._dropdown.hide()
+      })
+
+      footerEl.append(confirmButtonEl)
+    }
+
     this._dropdownMenuEl.append(footerEl)
   }
 
+  _createFooterContent() {
+    return ''
+  }
+
   _createPicker() {
@@ -143,0 +156,0 @@ if (this._config.container === 'dropdown') {

js/src/popover.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): popover.js
+ * CoreUI (v4.2.0-rc.1): popover.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/scrollspy.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): scrollspy.js
+ * CoreUI (v4.2.0-rc.1): scrollspy.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/sidebar.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): sidebar.js
+ * CoreUI (v4.2.0-rc.1): sidebar.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ * --------------------------------------------------------------------------

js/src/tab.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): tab.js
+ * CoreUI (v4.2.0-rc.1): tab.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/time-picker.js

@@ -5,3 +5,3 @@
  * --------------------------------------------------------------------------
- * CoreUI PRO (v4.2.0-rc.0): time-picker.js
+ * CoreUI PRO (v4.2.0-rc.1): time-picker.js
  * License (https://coreui.io/pro/license-new/)
@@ -8,0 +8,0 @@ * --------------------------------------------------------------------------

js/src/toast.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): toast.js
+ * CoreUI (v4.2.0-rc.1): toast.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/tooltip.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): tooltip.js
+ * CoreUI (v4.2.0-rc.1): tooltip.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/util/index.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): alert.js
+ * CoreUI (v4.2.0-rc.1): alert.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

js/src/util/sanitizer.js

 /**
  * --------------------------------------------------------------------------
- * CoreUI (v4.2.0-rc.0): alert.js
+ * CoreUI (v4.2.0-rc.1): alert.js
  * Licensed under MIT (https://coreui.io/license)
@@ -5,0 +5,0 @@ *

package.json

 {
   "name": "@coreui/coreui-pro",
   "description": "The most popular front-end framework for developing responsive, mobile-first projects on the web rewritten by the CoreUI Team",
-  "version": "4.2.0-rc.0",
+  "version": "4.2.0-rc.1",
   "config": {
@@ -22,3 +22,3 @@ "version_short": "4.1"
     "bundlewatch": "bundlewatch --config .bundlewatch.config.json",
-    "changelog": "auto-changelog --template build/changelog-template.hbs --commit-limit false --package --backfill-limit 0 --starting-version v4.2.0-rc.0",
+    "changelog": "auto-changelog --template build/changelog-template.hbs --commit-limit false --package --backfill-limit 0 --starting-version v4.2.0-rc.1",
     "css": "npm-run-all css-compile css-prefix css-minify",
@@ -104,2 +104,3 @@ "css-compile": "sass --style expanded --source-map --embed-sources --no-error-css scss/:dist/css/",
     "cross-env": "^7.0.3",
+    "date-fns": "^2.28.0",
     "eslint": "^8.10.0",
@@ -106,0 +107,0 @@ "eslint-config-xo": "^0.40.0",

README.md

@@ -42,7 +42,7 @@ <p align="center">
 
-- [Download the latest release](https://github.com/coreui/coreui/archive/v4.2.0-rc.0.zip)
+- [Download the latest release](https://github.com/coreui/coreui/archive/v4.2.0-rc.1.zip)
 - Clone the repo: `git clone https://github.com/coreui/coreui.git`
 - Install with [npm](https://www.npmjs.com/): `npm install @coreui/coreui`
 - Install with [yarn](https://yarnpkg.com/): `yarn add @coreui/coreui`
-- Install with [Composer](https://getcomposer.org/): `composer require coreui/coreui:4.2.0-rc.0`
+- Install with [Composer](https://getcomposer.org/): `composer require coreui/coreui:4.2.0-rc.1`
 
@@ -49,0 +49,0 @@ Read the [Getting started page](https://coreui.io/docs/getting-started/introduction/) for information on the framework contents, templates and examples, and more.

No alert changes

Improved metrics

Total package byte prevSize

12513415

increased by4.26%

Lines of code

85847

increased by3.66%

Worsened metrics

Dev dependency count

50

increased by2.04%

No dependency changes