feat(calendar): multimonth, parser & modal usage fix

Several small fixes:

Multimonth calendar offset was only possible by providing it via data attributes data-month-offset. This is now also possible by using the monthOffset value as well.
This PR also fixes date parsing in case whitespace is part of the date.
By disabling the observer in the popupoptions by default the calendar works properly when used inside modals
multimonth calendars now appear in the same way inside popup as a single calendar

Author: lubber-de

src/definitions/modules/calendar.js

@@ -746,7 +746,7 @@ $.fn.calendar = function(parameters) {
             return $module.data(metadata.maxDate) || null;
           },
           monthOffset: function () {
-            return $module.data(metadata.monthOffset) || 0;
+            return $module.data(metadata.monthOffset) || settings.monthOffset || 0;
           },
           mode: function () {
             //only returns valid modes for the current settings
@@ -1452,6 +1452,7 @@ $.fn.calendar.settings = {
   startCalendar      : null,       // jquery object or selector for another calendar that represents the start date of a date range
   endCalendar        : null,       // jquery object or selector for another calendar that represents the end date of a date range
   multiMonth         : 1,          // show multiple months when in 'day' mode
+  monthOffset        : 0,          // position current month by offset when multimonth > 1
   minTimeGap         : 5,
   showWeekNumbers    : null,       // show Number of Week at the very first column of a dayView
   disabledHours      : [],         // specific hour(s) which won't be selectable and contain additional information.
@@ -1467,6 +1468,7 @@ $.fn.calendar.settings = {
     position: 'bottom left',
     lastResort: 'bottom left',
     prefer: 'opposite',
+    observeChanges: false,
     hideOnScroll: false
   },
 
@@ -1558,7 +1560,7 @@ $.fn.calendar.settings = {
       if (!text) {
         return null;
       }
-      text = String(text).trim();
+      text = String(text).replace(/\s/g,'');
       if (text.length === 0) {
         return null;
       }

src/definitions/modules/calendar.less

@@ -172,6 +172,26 @@
   }
 }
 
+& when (@variationCalendarMultiMonth) {
+  .ui.calendar.popup > .ui.grid {
+    margin: @multiMonthMargin;
+    & > .column:not(:first-child) {
+      padding-left: @multiMonthPadding;
+      & > .ui.table {
+        border-top-left-radius:0;
+        border-bottom-left-radius:0;
+      }
+    }
+    & > .column:not(:last-child) {
+      padding-right:@multiMonthPadding;
+      & > .ui.table {
+        border-top-right-radius:0;
+        border-bottom-right-radius:0;
+      }
+    }
+  }
+}
+
 /*******************************
             States
 *******************************/

src/themes/default/globals/variation.variables

@@ -488,6 +488,7 @@
 /* Calendar */
 @variationCalendarInverted: true;
 @variationCalendarDisabled: true;
+@variationCalendarMultiMonth: true;
 
 /* Checkbox */
 @variationCheckboxDisabled: true;

src/themes/default/modules/calendar.variables

@@ -18,3 +18,6 @@
 @adjacentBackground: @subtleTransparentBlack;
 @adjacentInvertedTextColor: @invertedMutedTextColor;
 @adjacentInvertedBackground: @subtleTransparentWhite;
+
+@multiMonthMargin: -1rem;
+@multiMonthPadding: 0;