genesys-spark-components 3.30.0 → 3.31.0

package/dist/collection/components/stable/gux-datepicker/gux-datepicker.js

@@ -1,10 +1,14 @@
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
   return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-import { Component, Element, Event, h, Listen, Prop, State, Watch } from '@stencil/core';
+import { h } from '@stencil/core';
 import { trackComponent } from '../../../usage-tracking';
 import { randomHTMLId } from '../../../utils/dom/random-html-id';
 import { buildI18nForComponent } from '../../../i18n';
@@ -43,7 +47,7 @@ export class GuxDatepicker {
     /**
      * The calendar mode (can be single or range)
      */
-    this.mode = "single" /* Single */;
+    this.mode = "single" /* CalendarModes.Single */;
     /**
      * The datepicker date format (default to mm/dd/yyyy, or specified)
      */
@@ -267,7 +271,7 @@ export class GuxDatepicker {
     this.input.emit(this.value);
     this.updateDate();
     this.inputElement.value = this.formattedValue;
-    if (this.mode === "range" /* Range */) {
+    if (this.mode === "range" /* CalendarModes.Range */) {
       this.toInputElement.value = this.toFormattedValue;
     }
     if (document.activeElement !== this.inputElement ||
@@ -276,7 +280,7 @@ export class GuxDatepicker {
     }
   }
   setValue() {
-    if (this.mode === "range" /* Range */) {
+    if (this.mode === "range" /* CalendarModes.Range */) {
       const fromValue = this.stringToDate(this.inputElement.value);
       const toValue = this.stringToDate(this.toInputElement.value);
       this.value = asIsoDateRange(fromValue, toValue);
@@ -350,7 +354,7 @@ export class GuxDatepicker {
     };
   }
   updateDate() {
-    if (this.mode === "range" /* Range */) {
+    if (this.mode === "range" /* CalendarModes.Range */) {
       const [from, to] = fromIsoDateRange(this.value);
       const { map: map1, regexp: regexp1 } = this.getMapAndRegexFromField(from);
       this.formattedValue = this.format.replace(regexp1, match => {
@@ -392,7 +396,7 @@ export class GuxDatepicker {
     this.intervalRange = intervalRange;
   }
   getCombinedFocusedDateValue() {
-    return this.mode === "range" /* Range */
+    return this.mode === "range" /* CalendarModes.Range */
       ? this.getRangeFocusedDateValue()
       : this.getFocusedDateValue();
   }
@@ -438,13 +442,13 @@ export class GuxDatepicker {
     if (!this.value) {
       const now = new Date();
       now.setHours(0, 0, 0, 0);
-      if (this.mode === "range" /* Range */) {
+      if (this.mode === "range" /* CalendarModes.Range */) {
         this.value = asIsoDateRange(now, now);
       }
       else {
         this.value = asIsoDate(now);
       }
-      if (this.mode === "range" /* Range */ && this.numberOfMonths < 2) {
+      if (this.mode === "range" /* CalendarModes.Range */ && this.numberOfMonths < 2) {
         this.numberOfMonths = 2;
       }
     }
@@ -472,255 +476,255 @@ export class GuxDatepicker {
     (_a = this.popperInstance) === null || _a === void 0 ? void 0 : _a.destroy();
   }
   renderCalendarToggleButton() {
-    return (h("button", { class: "gux-calendar-toggle-button", type: "button", onClick: () => this.toggleCalendar(), "aria-expanded": this.active.toString(), "aria-label": this.i18n('toggleCalendar'), disabled: this.disabled },
-      h("gux-icon", { decorative: true, "icon-name": "calendar" })));
+    return (h("button", { class: "gux-calendar-toggle-button", type: "button", onClick: () => this.toggleCalendar(), "aria-expanded": this.active.toString(), "aria-label": this.i18n('toggleCalendar'), disabled: this.disabled }, h("gux-icon", { decorative: true, "icon-name": "calendar" })));
   }
   renderCalendar() {
     return (h("gux-calendar", { tabIndex: -1, ref: (el) => (this.calendarElement = el), value: this.value, mode: this.mode, onInput: (event) => this.onCalendarSelect(event), minDate: this.minDate, maxDate: this.maxDate, numberOfMonths: this.numberOfMonths }));
   }
   renderStartDateField() {
-    return (h("div", { class: "gux-datepicker-field" },
-      h("label", { htmlFor: this.startInputId, class: {
-          'gux-datepicker-field-label': true,
-          'gux-sr-only': this.mode === "single" /* Single */ && !this.label
-        } }, this.getCalendarLabels()[0]),
-      h("div", { class: "gux-datepicker-field-input" },
-        h("div", { class: "gux-datepicker-field-text-input" },
-          h("input", { id: this.startInputId, type: "text", onClick: e => this.onInputMouseUp(e), onFocusin: e => this.onInputFocusIn(e), onFocusout: () => this.onInputFocusOut(), ref: (el) => (this.inputElement = el), value: this.formattedValue, disabled: this.disabled }),
-          this.renderCalendarToggleButton()),
-        this.renderCalendar())));
+    return (h("div", { class: "gux-datepicker-field" }, h("label", { htmlFor: this.startInputId, class: {
+        'gux-datepicker-field-label': true,
+        'gux-sr-only': this.mode === "single" /* CalendarModes.Single */ && !this.label
+      } }, this.getCalendarLabels()[0]), h("div", { class: "gux-datepicker-field-input" }, h("div", { class: "gux-datepicker-field-text-input" }, h("input", { id: this.startInputId, type: "text", onClick: e => this.onInputMouseUp(e), onFocusin: e => this.onInputFocusIn(e), onFocusout: () => this.onInputFocusOut(), ref: (el) => (this.inputElement = el), value: this.formattedValue, disabled: this.disabled }), this.renderCalendarToggleButton()), this.renderCalendar())));
   }
   renderEndDateField() {
-    if (this.mode === "single" /* Single */) {
+    if (this.mode === "single" /* CalendarModes.Single */) {
       return null;
     }
-    return (h("div", { class: "gux-datepicker-field" },
-      h("label", { htmlFor: this.endInputId, class: "gux-datepicker-field-label" }, this.getCalendarLabels()[1]),
-      h("div", { class: "gux-datepicker-field-input" },
-        h("div", { class: "gux-datepicker-field-text-input" },
-          h("input", { id: this.endInputId, type: "text", ref: (el) => (this.toInputElement = el), onMouseUp: e => this.onInputMouseUp(e), onFocusin: e => this.onInputFocusIn(e), onFocusout: () => this.onInputFocusOut(), value: this.toFormattedValue, disabled: this.disabled }),
-          this.renderCalendarToggleButton()))));
+    return (h("div", { class: "gux-datepicker-field" }, h("label", { htmlFor: this.endInputId, class: "gux-datepicker-field-label" }, this.getCalendarLabels()[1]), h("div", { class: "gux-datepicker-field-input" }, h("div", { class: "gux-datepicker-field-text-input" }, h("input", { id: this.endInputId, type: "text", ref: (el) => (this.toInputElement = el), onMouseUp: e => this.onInputMouseUp(e), onFocusin: e => this.onInputFocusIn(e), onFocusout: () => this.onInputFocusOut(), value: this.toFormattedValue, disabled: this.disabled }), this.renderCalendarToggleButton()))));
   }
   render() {
     return (h("div", { class: {
         'gux-datepicker': true,
         'gux-active': this.active,
         'gux-disabled': this.disabled
-      }, ref: (el) => (this.datepickerElement = el) },
-      this.renderStartDateField(),
-      this.renderEndDateField()));
+      }, ref: (el) => (this.datepickerElement = el) }, this.renderStartDateField(), this.renderEndDateField()));
   }
   static get is() { return "gux-datepicker"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["gux-datepicker.less"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["gux-datepicker.css"]
-  }; }
-  static get properties() { return {
-    "value": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The datepicker current value"
-      },
-      "attribute": "value",
-      "reflect": false
-    },
-    "label": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The datepicker label (can be a single label, or two separated by a comma if it's a range datepicker)"
-      },
-      "attribute": "label",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "numberOfMonths": {
-      "type": "number",
-      "mutable": true,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The datepicker number of months displayed"
+  static get originalStyleUrls() {
+    return {
+      "$": ["gux-datepicker.less"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["gux-datepicker.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "value": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The datepicker current value"
+        },
+        "attribute": "value",
+        "reflect": false
       },
-      "attribute": "number-of-months",
-      "reflect": false,
-      "defaultValue": "1"
-    },
-    "minDate": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "label": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The datepicker label (can be a single label, or two separated by a comma if it's a range datepicker)"
+        },
+        "attribute": "label",
+        "reflect": false,
+        "defaultValue": "''"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The min date selectable"
+      "numberOfMonths": {
+        "type": "number",
+        "mutable": true,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The datepicker number of months displayed"
+        },
+        "attribute": "number-of-months",
+        "reflect": false,
+        "defaultValue": "1"
       },
-      "attribute": "min-date",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "maxDate": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "minDate": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The min date selectable"
+        },
+        "attribute": "min-date",
+        "reflect": false,
+        "defaultValue": "''"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The max date selectable"
+      "maxDate": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The max date selectable"
+        },
+        "attribute": "max-date",
+        "reflect": false,
+        "defaultValue": "''"
       },
-      "attribute": "max-date",
-      "reflect": false,
-      "defaultValue": "''"
-    },
-    "mode": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "GuxDatepickerMode",
-        "resolved": "CalendarModes.Range | CalendarModes.Single",
-        "references": {
-          "GuxDatepickerMode": {
-            "location": "import",
-            "path": "./gux-datepicker.types"
+      "mode": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "GuxDatepickerMode",
+          "resolved": "CalendarModes.Range | CalendarModes.Single",
+          "references": {
+            "GuxDatepickerMode": {
+              "location": "import",
+              "path": "./gux-datepicker.types"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The calendar mode (can be single or range)"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The calendar mode (can be single or range)"
+        },
+        "attribute": "mode",
+        "reflect": false,
+        "defaultValue": "CalendarModes.Single"
       },
-      "attribute": "mode",
-      "reflect": false,
-      "defaultValue": "CalendarModes.Single"
-    },
-    "format": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "format": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The datepicker date format (default to mm/dd/yyyy, or specified)"
+        },
+        "attribute": "format",
+        "reflect": false,
+        "defaultValue": "'mm/dd/yyyy'"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The datepicker date format (default to mm/dd/yyyy, or specified)"
-      },
-      "attribute": "format",
-      "reflect": false,
-      "defaultValue": "'mm/dd/yyyy'"
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Disable the input and prevent interactions."
-      },
-      "attribute": "disabled",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
-  static get states() { return {
-    "formattedValue": {},
-    "minDateDate": {},
-    "maxDateDate": {},
-    "toFormattedValue": {},
-    "active": {}
-  }; }
-  static get events() { return [{
-      "method": "input",
-      "name": "input",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Triggered when user selects a date"
-      },
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Disable the input and prevent interactions."
+        },
+        "attribute": "disabled",
+        "reflect": false,
+        "defaultValue": "false"
       }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "formattedValue": {},
+      "minDateDate": {},
+      "maxDateDate": {},
+      "toFormattedValue": {},
+      "active": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "input",
+        "name": "input",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Triggered when user selects a date"
+        },
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "root"; }
-  static get watchers() { return [{
-      "propName": "value",
-      "methodName": "watchValue"
-    }, {
-      "propName": "minDate",
-      "methodName": "watchMinDate"
-    }, {
-      "propName": "maxDate",
-      "methodName": "watchMaxDate"
-    }, {
-      "propName": "format",
-      "methodName": "watchFormat"
-    }, {
-      "propName": "active",
-      "methodName": "watchActiveCalendar"
-    }]; }
-  static get listeners() { return [{
-      "name": "keydown",
-      "method": "onKeyDown",
-      "target": undefined,
-      "capture": false,
-      "passive": false
-    }, {
-      "name": "mousedown",
-      "method": "onMouseDown",
-      "target": undefined,
-      "capture": false,
-      "passive": true
-    }]; }
+  static get watchers() {
+    return [{
+        "propName": "value",
+        "methodName": "watchValue"
+      }, {
+        "propName": "minDate",
+        "methodName": "watchMinDate"
+      }, {
+        "propName": "maxDate",
+        "methodName": "watchMaxDate"
+      }, {
+        "propName": "format",
+        "methodName": "watchFormat"
+      }, {
+        "propName": "active",
+        "methodName": "watchActiveCalendar"
+      }];
+  }
+  static get listeners() {
+    return [{
+        "name": "keydown",
+        "method": "onKeyDown",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "mousedown",
+        "method": "onMouseDown",
+        "target": undefined,
+        "capture": false,
+        "passive": true
+      }];
+  }
 }
 __decorate([
   OnClickOutside({ triggerEvents: 'mousedown' })

package/dist/collection/components/stable/gux-datepicker/gux-datepicker.service.js

@@ -1,9 +1,9 @@
 export function getCalendarLabels(labelString, mode, defaultLabels) {
   const labels = labelString.split(',').map(label => label.trim());
-  if (mode === "range" /* Range */) {
+  if (mode === "range" /* CalendarModes.Range */) {
     return [labels[0] || defaultLabels[0], labels[1] || defaultLabels[1]];
   }
-  else if (mode !== "range" /* Range */ && !labels[0]) {
+  else if (mode !== "range" /* CalendarModes.Range */ && !labels[0]) {
     return [defaultLabels[2]];
   }
   return [labels[0]];