[lightpick] Lightpick 1.4.5 (#40168)

* Amended option `parentEl`.
* Added options `onSelectStart` and `onSelectEnd`.

types/lightpick/index.d.ts

@@ -124,7 +124,7 @@ declare namespace Lightpick {
         /**
          * Selector of the parent element that the date range picker will be added to, if not provided this will be 'body'.
          */
-        parentEl?: string;
+        parentEl?: string | Node;
 
         /**
          * Language code for names of days, months by Date.prototype.toLocaleString(). 'auto' will try detect user browser language.
@@ -257,6 +257,16 @@ declare namespace Lightpick {
          */
         onSelect?: Options.OnSelectFn;
 
+        /**
+         * Triggered when start date has been changed.
+         */
+        onSelectStart?: Options.OnSelectStartEndFn;
+
+        /**
+         * Triggered when end date has been changed.
+         */
+        onSelectEnd?: Options.OnSelectStartEndFn;
+
         /**
          * Triggered when calendar has been opened.
          */
@@ -373,6 +383,13 @@ declare namespace Lightpick {
             (this: Lightpick, startDate: OutputDate, endDate: OutputDate): void;
         }
 
+        /**
+         * Callback function for when either a start or an end date is selected.
+         */
+        interface OnSelectStartEndFn {
+            (this: Lightpick, date: OutputDate): void;
+        }
+
         /**
          * Callback function for when the picker becomes visible.
          */

types/lightpick/lightpick-tests.ts

@@ -56,6 +56,7 @@ const inputDate = moment();
     options.numberOfColumns = 1;
     options.orientation = 'top right';
     options.parentEl = 'body';
+    options.parentEl = document.body;
     options.repick = true;
     options.selectForward = true;
     options.selectBackward = true;
@@ -72,6 +73,16 @@ const inputDate = moment();
         str += to ? to.format('Do MMMM YYYY') : '...';
         console.log(`str: ${str}`);
     };
+    options.onSelectStart = (from: Lightpick.OutputDate) => {
+        let str = '';
+        str += from ? from.format('Do MMMM YYYY') + ' to ' : '';
+        console.log(`str: ${str}`);
+    };
+    options.onSelectEnd = (to: Lightpick.OutputDate) => {
+        let str = '';
+        str += to ? to.format('Do MMMM YYYY') : '...';
+        console.log(`str: ${str}`);
+    };
     options.onMonthsChange = (month: number) => console.log(`changing to month ${month} event`);
     options.onYearsChange = (year: number) => console.log(`changing to year ${year} event`);