@vonage/vivid 4.24.0 → 4.26.0

package/shared/definition18.cjs

@@ -1,27 +1,26 @@
 'use strict';
 
-const definition$1 = require('./definition65.cjs');
+const definition$1 = require('./definition67.cjs');
 const definition = require('./definition11.cjs');
-const definition$2 = require('./definition57.cjs');
+const definition$2 = require('./definition58.cjs');
 const definition$3 = require('./definition23.cjs');
 const pickerField_template = require('./picker-field.template.cjs');
 const calendarPicker_template = require('./calendar-picker.template.cjs');
 const vividElement = require('./vivid-element.cjs');
 const singleValuePicker = require('./single-value-picker.cjs');
 const singleDatePicker = require('./single-date-picker.cjs');
-const formElements = require('./form-elements.cjs');
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  var result = __getOwnPropDesc(target, key) ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp(target, key, result);
   return result;
 };
-exports.DatePicker = class DatePicker extends singleDatePicker.SingleDatePickerMixin(
+class DatePicker extends singleDatePicker.SingleDatePickerMixin(
   singleValuePicker.SingleValuePicker(calendarPicker_template.MinMaxCalendarPicker(calendarPicker_template.CalendarPicker(pickerField_template.PickerField)))
 ) {
   constructor() {
@@ -112,14 +111,10 @@ exports.DatePicker = class DatePicker extends singleDatePicker.SingleDatePickerM
   get _pickerButtonIcon() {
     return "calendar-line";
   }
-};
+}
 __decorateClass([
   vividElement.volatile
-], exports.DatePicker.prototype, "_pickerButtonLabel", 1);
-exports.DatePicker = __decorateClass([
-  formElements.errorText,
-  formElements.formElements
-], exports.DatePicker);
+], DatePicker.prototype, "_pickerButtonLabel");
 
 const DatePickerTemplate = (context) => {
   return pickerField_template.PickerFieldTemplate(context, calendarPicker_template.CalendarPickerTemplate(context), {
@@ -130,7 +125,7 @@ const DatePickerTemplate = (context) => {
 
 const datePickerDefinition = vividElement.defineVividComponent(
   "date-picker",
-  exports.DatePicker,
+  DatePicker,
   DatePickerTemplate,
   [definition.buttonDefinition, definition$1.popupDefinition, definition$2.textFieldDefinition, definition$3.dividerDefinition],
   {
@@ -142,5 +137,6 @@ const datePickerDefinition = vividElement.defineVividComponent(
 );
 const registerDatePicker = vividElement.createRegisterFunction(datePickerDefinition);
 
+exports.DatePicker = DatePicker;
 exports.datePickerDefinition = datePickerDefinition;
 exports.registerDatePicker = registerDatePicker;

package/shared/definition18.js

@@ -1,25 +1,24 @@
-import { p as popupDefinition } from './definition65.js';
+import { p as popupDefinition } from './definition67.js';
 import { b as buttonDefinition } from './definition11.js';
-import { t as textFieldDefinition } from './definition57.js';
+import { t as textFieldDefinition } from './definition58.js';
 import { d as dividerDefinition } from './definition23.js';
 import { a as PickerField, P as PickerFieldTemplate, p as pickerFieldStyles } from './picker-field.template.js';
 import { M as MinMaxCalendarPicker, C as CalendarPicker, i as isValidDateStr, f as formatPresentationDate, p as parsePresentationDate, a as CalendarPickerTemplate, c as calendarStyles } from './calendar-picker.template.js';
-import { v as volatile, g as createRegisterFunction, i as defineVividComponent } from './vivid-element.js';
+import { v as volatile, d as createRegisterFunction, f as defineVividComponent } from './vivid-element.js';
 import { S as SingleValuePicker } from './single-value-picker.js';
 import { S as SingleDatePickerMixin } from './single-date-picker.js';
-import { e as errorText, f as formElements } from './form-elements.js';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  var result = __getOwnPropDesc(target, key) ;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
     if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
+      result = (decorator(target, key, result) ) || result;
+  if (result) __defProp(target, key, result);
   return result;
 };
-let DatePicker = class extends SingleDatePickerMixin(
+class DatePicker extends SingleDatePickerMixin(
   SingleValuePicker(MinMaxCalendarPicker(CalendarPicker(PickerField)))
 ) {
   constructor() {
@@ -110,14 +109,10 @@ let DatePicker = class extends SingleDatePickerMixin(
   get _pickerButtonIcon() {
     return "calendar-line";
   }
-};
+}
 __decorateClass([
   volatile
-], DatePicker.prototype, "_pickerButtonLabel", 1);
-DatePicker = __decorateClass([
-  errorText,
-  formElements
-], DatePicker);
+], DatePicker.prototype, "_pickerButtonLabel");
 
 const DatePickerTemplate = (context) => {
   return PickerFieldTemplate(context, CalendarPickerTemplate(context), {

package/shared/definition19.cjs

@@ -1,13 +1,12 @@
 'use strict';
 
 const definition = require('./definition11.cjs');
-const definition$1 = require('./definition65.cjs');
-const definition$2 = require('./definition57.cjs');
+const definition$1 = require('./definition67.cjs');
+const definition$2 = require('./definition58.cjs');
 const definition$3 = require('./definition23.cjs');
 const vividElement = require('./vivid-element.cjs');
 const pickerField_template = require('./picker-field.template.cjs');
 const calendarPicker_template = require('./calendar-picker.template.cjs');
-const formElements = require('./form-elements.cjs');
 
 const formatRange = (from, to) => {
   return `${from} – ${to}`;
@@ -31,9 +30,6 @@ const parsePresentationDateRange = (presentationDateRange, locale) => {
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
 var __decorateClass = (decorators, target, key, kind) => {
   var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
   for (var i = decorators.length - 1, decorator; i >= 0; i--)
@@ -42,25 +38,18 @@ var __decorateClass = (decorators, target, key, kind) => {
   if (kind && result) __defProp(target, key, result);
   return result;
 };
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
-var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _isInternalValueUpdate, _DateRangePicker_instances, updateValues_fn, handleChangedValues_fn, updateFormValue_fn, getVisibleRange_fn;
 const isFormAssociatedTryingToSetFormValue = (value) => typeof value === "string";
 function isDefined(value) {
   return !!value;
 }
-exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.MinMaxCalendarPicker(
+class DateRangePicker extends calendarPicker_template.MinMaxCalendarPicker(
   calendarPicker_template.CalendarPicker(pickerField_template.PickerField)
 ) {
   constructor() {
     super(...arguments);
-    __privateAdd(this, _DateRangePicker_instances);
     this.initialStart = "";
     this.initialEnd = "";
-    __privateAdd(this, _isInternalValueUpdate, false);
+    this.#isInternalValueUpdate = false;
     this.start = "";
     this.end = "";
     /**
@@ -100,6 +89,7 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
       this.dirtyValue = false;
     }
   }
+  #isInternalValueUpdate;
   /**
    * @internal
    */
@@ -110,8 +100,8 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
     }
     this.currentStart = this.start;
     this.dirtyValue = true;
-    if (!__privateGet(this, _isInternalValueUpdate)) {
-      __privateMethod(this, _DateRangePicker_instances, handleChangedValues_fn).call(this);
+    if (!this.#isInternalValueUpdate) {
+      this.#handleChangedValues();
     }
   }
   /**
@@ -124,8 +114,8 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
     }
     this.currentEnd = this.end;
     this.dirtyValue = true;
-    if (!__privateGet(this, _isInternalValueUpdate)) {
-      __privateMethod(this, _DateRangePicker_instances, handleChangedValues_fn).call(this);
+    if (!this.#isInternalValueUpdate) {
+      this.#handleChangedValues();
     }
   }
   /**
@@ -140,6 +130,38 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
   currentEndChanged() {
     this.end = this.currentEnd;
   }
+  #updateValues(range) {
+    this.#isInternalValueUpdate = true;
+    if (range.start !== void 0) {
+      this.start = range.start;
+      this.$emit("input:start");
+    }
+    if (range.end !== void 0) {
+      this.end = range.end;
+      this.$emit("input:end");
+    }
+    this.#isInternalValueUpdate = false;
+    this.$emit("input");
+    this.$emit("change");
+    this.#handleChangedValues();
+  }
+  #handleChangedValues() {
+    if (this.start && this.end) {
+      if (calendarPicker_template.compareDateStr(this.start, this.end) > 0) {
+        this.#updateValues({ start: this.end, end: this.start });
+        return;
+      }
+      this.value = formatRange(this.start, this.end);
+    } else {
+      this.value = "";
+    }
+    this._updatePresentationValue();
+    const dateToEnsureVisibilityOf = this.start || this.end;
+    if (dateToEnsureVisibilityOf) {
+      this._adjustSelectedMonthToEnsureVisibilityOf(dateToEnsureVisibilityOf);
+    }
+    this.#updateFormValue();
+  }
   /**
    * @internal
    */
@@ -161,7 +183,17 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
    */
   nameChanged(previous, next) {
     super.nameChanged(previous, next);
-    __privateMethod(this, _DateRangePicker_instances, updateFormValue_fn).call(this);
+    this.#updateFormValue();
+  }
+  #updateFormValue() {
+    if (!this.name || !this.start || !this.end) {
+      this.setFormValue(null);
+    } else {
+      const formData = new FormData();
+      formData.append(this.name, this.start);
+      formData.append(this.name, this.end);
+      this.setFormValue(formData);
+    }
   }
   /**
    * @internal
@@ -175,6 +207,15 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
       this.end = this.initialEnd;
     }
   }
+  #getVisibleRange() {
+    const candidates = [this.start, this.end].filter(isDefined);
+    const isPartialRange = candidates.length === 1;
+    if (this._hoverDate && isPartialRange) {
+      candidates.push(this._hoverDate);
+    }
+    const [start, end] = candidates.sort(calendarPicker_template.compareDateStr);
+    return { start, end };
+  }
   /**
    * @internal
    */
@@ -185,7 +226,7 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
    * @internal
    */
   _isDateInSelectedRange(date) {
-    const { start, end } = __privateMethod(this, _DateRangePicker_instances, getVisibleRange_fn).call(this);
+    const { start, end } = this.#getVisibleRange();
     if (start && end) {
       return calendarPicker_template.compareDateStr(date, start) >= 0 && calendarPicker_template.compareDateStr(date, end) <= 0;
     }
@@ -195,13 +236,13 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
    * @internal
    */
   _isDateRangeStart(date) {
-    return date === __privateMethod(this, _DateRangePicker_instances, getVisibleRange_fn).call(this).start;
+    return date === this.#getVisibleRange().start;
   }
   /**
    * @internal
    */
   _isDateRangeEnd(date) {
-    return date === __privateMethod(this, _DateRangePicker_instances, getVisibleRange_fn).call(this).end;
+    return date === this.#getVisibleRange().end;
   }
   /**
    * @internal
@@ -221,15 +262,15 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
    */
   _onDateClick(date) {
     if (this.start && this.end) {
-      __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start: date, end: "" });
+      this.#updateValues({ start: date, end: "" });
     } else if (this.start) {
-      __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { end: date });
+      this.#updateValues({ end: date });
       this._closePopup();
     } else if (this.end) {
-      __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start: date });
+      this.#updateValues({ start: date });
       this._closePopup();
     } else {
-      __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start: date });
+      this.#updateValues({ start: date });
     }
   }
   /**
@@ -246,7 +287,7 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
    */
   _onTextFieldChange() {
     if (this._presentationValue === "") {
-      __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start: "", end: "" });
+      this.#updateValues({ start: "", end: "" });
       return;
     }
     try {
@@ -254,10 +295,10 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
         this._presentationValue,
         this.locale.calendarPicker
       );
-      __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start, end });
+      this.#updateValues({ start, end });
     } catch (_) {
       const invalidPresentationValue = this._presentationValue;
-      __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start: "", end: "" });
+      this.#updateValues({ start: "", end: "" });
       this._presentationValue = invalidPresentationValue;
       return;
     }
@@ -314,14 +355,14 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
    * @internal
    */
   _onClearClick() {
-    __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start: "", end: "" });
+    this.#updateValues({ start: "", end: "" });
     super._onClearClick();
   }
   /**
    * @internal
    */
   formResetCallback() {
-    __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start: this.initialStart, end: this.initialEnd });
+    this.#updateValues({ start: this.initialStart, end: this.initialEnd });
     super.formResetCallback();
   }
   get _pickerButtonLabel() {
@@ -359,91 +400,34 @@ exports.DateRangePicker = class DateRangePicker extends calendarPicker_template.
   get _pickerButtonIcon() {
     return "calendar-line";
   }
-};
-_isInternalValueUpdate = new WeakMap();
-_DateRangePicker_instances = new WeakSet();
-updateValues_fn = function(range) {
-  __privateSet(this, _isInternalValueUpdate, true);
-  if (range.start !== void 0) {
-    this.start = range.start;
-    this.$emit("input:start");
-  }
-  if (range.end !== void 0) {
-    this.end = range.end;
-    this.$emit("input:end");
-  }
-  __privateSet(this, _isInternalValueUpdate, false);
-  this.$emit("input");
-  this.$emit("change");
-  __privateMethod(this, _DateRangePicker_instances, handleChangedValues_fn).call(this);
-};
-handleChangedValues_fn = function() {
-  if (this.start && this.end) {
-    if (calendarPicker_template.compareDateStr(this.start, this.end) > 0) {
-      __privateMethod(this, _DateRangePicker_instances, updateValues_fn).call(this, { start: this.end, end: this.start });
-      return;
-    }
-    this.value = formatRange(this.start, this.end);
-  } else {
-    this.value = "";
-  }
-  this._updatePresentationValue();
-  const dateToEnsureVisibilityOf = this.start || this.end;
-  if (dateToEnsureVisibilityOf) {
-    this._adjustSelectedMonthToEnsureVisibilityOf(dateToEnsureVisibilityOf);
-  }
-  __privateMethod(this, _DateRangePicker_instances, updateFormValue_fn).call(this);
-};
-updateFormValue_fn = function() {
-  if (!this.name || !this.start || !this.end) {
-    this.setFormValue(null);
-  } else {
-    const formData = new FormData();
-    formData.append(this.name, this.start);
-    formData.append(this.name, this.end);
-    this.setFormValue(formData);
-  }
-};
-getVisibleRange_fn = function() {
-  const candidates = [this.start, this.end].filter(isDefined);
-  const isPartialRange = candidates.length === 1;
-  if (this._hoverDate && isPartialRange) {
-    candidates.push(this._hoverDate);
-  }
-  const [start, end] = candidates.sort(calendarPicker_template.compareDateStr);
-  return { start, end };
-};
+}
 __decorateClass([
   vividElement.attr({ mode: "fromView", attribute: "start" })
-], exports.DateRangePicker.prototype, "initialStart", 2);
+], DateRangePicker.prototype, "initialStart", 2);
 __decorateClass([
   vividElement.attr({ mode: "fromView", attribute: "end" })
-], exports.DateRangePicker.prototype, "initialEnd", 2);
+], DateRangePicker.prototype, "initialEnd", 2);
 __decorateClass([
   vividElement.observable
-], exports.DateRangePicker.prototype, "start", 2);
+], DateRangePicker.prototype, "start", 2);
 __decorateClass([
   vividElement.observable
-], exports.DateRangePicker.prototype, "end", 2);
+], DateRangePicker.prototype, "end", 2);
 __decorateClass([
   vividElement.attr({ attribute: "current-start" })
-], exports.DateRangePicker.prototype, "currentStart", 2);
+], DateRangePicker.prototype, "currentStart", 2);
 __decorateClass([
   vividElement.attr({ attribute: "current-end" })
-], exports.DateRangePicker.prototype, "currentEnd", 2);
+], DateRangePicker.prototype, "currentEnd", 2);
 __decorateClass([
   vividElement.observable
-], exports.DateRangePicker.prototype, "_numCalendars", 2);
+], DateRangePicker.prototype, "_numCalendars", 2);
 __decorateClass([
   vividElement.observable
-], exports.DateRangePicker.prototype, "_hoverDate", 2);
+], DateRangePicker.prototype, "_hoverDate", 2);
 __decorateClass([
   vividElement.volatile
-], exports.DateRangePicker.prototype, "_pickerButtonLabel", 1);
-exports.DateRangePicker = __decorateClass([
-  formElements.errorText,
-  formElements.formElements
-], exports.DateRangePicker);
+], DateRangePicker.prototype, "_pickerButtonLabel", 1);
 
 const DateRangePickerTemplate = (context) => {
   return pickerField_template.PickerFieldTemplate(context, calendarPicker_template.CalendarPickerTemplate(context), {
@@ -454,7 +438,7 @@ const DateRangePickerTemplate = (context) => {
 
 const dateRangePickerDefinition = vividElement.defineVividComponent(
   "date-range-picker",
-  exports.DateRangePicker,
+  DateRangePicker,
   DateRangePickerTemplate,
   [definition.buttonDefinition, definition$1.popupDefinition, definition$2.textFieldDefinition, definition$3.dividerDefinition],
   {
@@ -468,5 +452,6 @@ const registerDateRangePicker = vividElement.createRegisterFunction(
   dateRangePickerDefinition
 );
 
+exports.DateRangePicker = DateRangePicker;
 exports.dateRangePickerDefinition = dateRangePickerDefinition;
 exports.registerDateRangePicker = registerDateRangePicker;