@globalpayments/vega 2.38.0 → 2.40.0

package/dist/cjs/vega-stepper.cjs.entry.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-09acd3c9.js');
-const minNumberRule = require('./min-number-rule-115c5a3b.js');
+const minNumberRule = require('./min-number-rule-5bcccc8f.js');
 const component = require('./component-73a88c4e.js');
 const number = require('./number-4816603d.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-dcb32c24.js');
-const formFieldControllerSlimmer = require('./form-field-controller-slimmer-48c0ad0b.js');
+const formFieldControllerSlimmer = require('./form-field-controller-slimmer-d92e8212.js');
 const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-af2addec.js');
 const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-80b3ac6c.js');
 const domNodeSubjectFactory = require('./dom-node-subject-factory-ce1777a9.js');
@@ -16,6 +16,7 @@ const staticSubjectTitle = require('./static-subject-title-c589a1bd.js');
 const changeManager = require('./change-manager-a297e4d2.js');
 const eventEmitSlimmer = require('./event-emit-slimmer-208a19e4.js');
 const ui = require('./ui-5fd9b267.js');
+require('./internal-form-field-validation-rule.abstract-07cdff46.js');
 require('./string-21427167.js');
 require('./observer-f49483e8.js');
 require('./create-public-api-runtime-metrics-slimmer-54c3f73b.js');

package/dist/cjs/vega-textarea.cjs.entry.js

@@ -3,17 +3,18 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-09acd3c9.js');
-const minStringLengthRule = require('./min-string-length-rule-75f24a48.js');
-const requiredFieldRule = require('./required-field-rule-7f9945fa.js');
+const minStringLengthRule = require('./min-string-length-rule-af215976.js');
+const requiredFieldRule = require('./required-field-rule-d73c1d8c.js');
 const component = require('./component-73a88c4e.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-dcb32c24.js');
-const formFieldControllerSlimmer = require('./form-field-controller-slimmer-48c0ad0b.js');
+const formFieldControllerSlimmer = require('./form-field-controller-slimmer-d92e8212.js');
 const staticSubjectTitle = require('./static-subject-title-c589a1bd.js');
 const changeManager = require('./change-manager-a297e4d2.js');
 const eventEmitSlimmer = require('./event-emit-slimmer-208a19e4.js');
 const domNodeSubjectFactory = require('./dom-node-subject-factory-ce1777a9.js');
 const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-af2addec.js');
+require('./internal-form-field-validation-rule.abstract-07cdff46.js');
 require('./string-21427167.js');
 require('./observer-f49483e8.js');
 require('./ui-5fd9b267.js');

package/dist/cjs/vega-time-picker_2.cjs.entry.js

@@ -4,21 +4,23 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-09acd3c9.js');
 const componentLoadRequired = require('./component-load-required-16d76afa.js');
-const date = require('./date-0a6bb035.js');
+const timeRequiredRule = require('./time-required-rule-ccf178e7.js');
 const component = require('./component-73a88c4e.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-dcb32c24.js');
-const formFieldControllerSlimmer = require('./form-field-controller-slimmer-48c0ad0b.js');
+const formFieldControllerSlimmer = require('./form-field-controller-slimmer-d92e8212.js');
 const domNodeSubjectObserverFactory = require('./dom-node-subject-observer-factory-80b3ac6c.js');
 const domNodeSubjectFactory = require('./dom-node-subject-factory-ce1777a9.js');
 const ui = require('./ui-5fd9b267.js');
 const accessibility = require('./accessibility-bfa227f6.js');
+const date = require('./date-0a6bb035.js');
 const array = require('./array-5adef7b2.js');
 const staticSubjectTitle = require('./static-subject-title-c589a1bd.js');
 const changeManager = require('./change-manager-a297e4d2.js');
-const elementAppenderSlimmer = require('./element-appender-slimmer-c6e0f4ca.js');
+const elementAppenderSlimmer = require('./element-appender-slimmer-4f0dc8c6.js');
 const keyboardManagerSlimmer = require('./keyboard-manager-slimmer-feba3a83.js');
 const typeGuard = require('./type-guard-4ba85fdc.js');
+const internalFormFieldValidationRule_abstract = require('./internal-form-field-validation-rule.abstract-07cdff46.js');
 const childNodesEventPreventSlimmer = require('./child-nodes-event-prevent-slimmer-af2addec.js');
 const eventEmitSlimmer = require('./event-emit-slimmer-208a19e4.js');
 const translationSlimmer = require('./translation-slimmer-510906bc.js');
@@ -47,71 +49,6 @@ require('./feature-flag-controller-7b22e598.js');
 require('./index-8b247c17.js');
 require('./_commonjsHelpers-537d719a.js');
 
-/**
- * A rule that checks if time is empty or not
- *
- * @implements {FormFieldValidationRule<string>}
- */
-class TimeRequiredRule {
-  /**
-   * It creates a new instance of the class with the given config.
-   *
-   * @param {{ timeFormat: TimeFormat }} config - config including the timeFormat for time value
-   * @param {TimeFormat} config.timeFormat - The timeFormat for time value
-   */
-  constructor(config) {
-    this.config = config;
-  }
-  /**
-   * It checks if the input is a valid time string.
-   *
-   * @param {string} input - The value of the input field.
-   * @returns {EvaluateResultTranslation} An object with two properties: isValid and message.
-   */
-  evaluate(input) {
-    if (!this.isAcceptedInputType(input)) {
-      throw new Error(`Invalid time value ${input}`);
-    }
-    const isValid = date.isTimeStr(input, this.config.timeFormat);
-    return {
-      isValid,
-      message: isValid ? '' : 'This field is required',
-    };
-  }
-  /**
-   * If the input is accepted and the status is not disabled and visible, then return true
-   *
-   * @param {unknown} input - The input to be evaluated.
-   * @param {FormFieldStatusMeta} [status] - FormFieldStatusMeta
-   * @returns {boolean} A boolean value.
-   */
-  canEvaluate(input, status) {
-    return status
-      ? this.isAcceptedInputType(input) && !status.disabled && status.visible
-      : this.isAcceptedInputType(input);
-  }
-  /**
-   * If the field is not disabled, visible, and has been touched or modified, then show the error
-   *
-   * @param {FormFieldStatusMeta} status - FormFieldStatusMeta
-   * @returns {boolean} A boolean value.
-   */
-  shouldShowError(status) {
-    return !status.disabled && status.visible && (status.touched || status.modified);
-  }
-  /**
-   * If the input is undefined or null, return true, otherwise return true if the input is a string.
-   *
-   * @param {unknown} input - The input value to be validated.
-   * @returns {boolean}A boolean.
-   */
-  isAcceptedInputType(input) {
-    if (input === undefined || input === null)
-      return true;
-    return typeof input === 'string';
-  }
-}
-
 var __decorate$d = (undefined && undefined.__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);
@@ -1529,7 +1466,7 @@ __decorate$4([
 /**
  * A rule that checks if start time is before than end time
  */
-class TimeRangeRule {
+class TimeRangeRule extends internalFormFieldValidationRule_abstract.InternalFormFieldValidationRule {
   /**
    * It creates a new instance of the class with the given config.
    *
@@ -1537,6 +1474,7 @@ class TimeRangeRule {
    * @param {TimeFormat} config.timeFormat - The timeFormat for time value
    */
   constructor(config) {
+    super();
     this.config = config;
   }
   /**
@@ -1739,73 +1677,6 @@ __decorate$2([
   globalSlimmerRegistry.MapToComponentMethod('watchDisabled')
 ], VegaTimePickerRangeDropdownController.prototype, "hideDropdownWhenDisabled", null);
 
-/**
- * A rule that checks if time is empty or not
- *
- * @implements {FormFieldValidationRule<string[]>}
- */
-class TimeRangeRequiredRule {
-  /**
-   * It creates a new instance of the class with the given config.
-   *
-   * @param {{ timeFormat: TimeFormat }} config - config including the timeFormat for time value
-   * @param {TimeFormat} config.timeFormat - The timeFormat for time value
-   */
-  constructor(config) {
-    this.config = config;
-  }
-  /**
-   * It checks if the input is a valid time string.
-   *
-   * @param {string} input - The value of the input field.
-   * @returns {EvaluateResultTranslation} An object with two properties: isValid and message.
-   */
-  evaluate(input) {
-    if (!this.isAcceptedInputType(input)) {
-      throw new Error(`Invalid time value ${input} for range mode`);
-    }
-    const isValid = Array.isArray(input) &&
-      input.length === 2 &&
-      input.every((item) => date.isTimeStr(item, this.config.timeFormat));
-    return {
-      isValid,
-      message: isValid ? '' : 'This field is required',
-    };
-  }
-  /**
-   * If the input is accepted and the status is not disabled and visible, then return true
-   *
-   * @param {unknown} input - The input to be evaluated.
-   * @param {FormFieldStatusMeta} [status] - FormFieldStatusMeta
-   * @returns {boolean} A boolean value.
-   */
-  canEvaluate(input, status) {
-    return status
-      ? this.isAcceptedInputType(input) && !status.disabled && status.visible
-      : this.isAcceptedInputType(input);
-  }
-  /**
-   * If the field is not disabled, visible, and has been touched or modified, then show the error
-   *
-   * @param {FormFieldStatusMeta} status - FormFieldStatusMeta
-   * @returns {boolean} A boolean value.
-   */
-  shouldShowError(status) {
-    return !status.disabled && status.visible && (status.touched || status.modified);
-  }
-  /**
-   * If the input is undefined or null, return true, otherwise return true if the input is a string.
-   *
-   * @param {unknown} input - The input value to be validated.
-   * @returns {boolean}A boolean.
-   */
-  isAcceptedInputType(input) {
-    if (input === undefined || input === null)
-      return true;
-    return Array.isArray(input);
-  }
-}
-
 const VegaTimePickerRuntimeMetricsPayloadDefinition = [
   {
     payloadKey: 'AUTO_VALIDATION_IS_TRUE',
@@ -1889,8 +1760,8 @@ const VegaTimePicker = class {
           propertyName: 'required',
           ruleFactory: (isRequired, timeFormat, mode) => isRequired
             ? mode === 'range'
-              ? new TimeRangeRequiredRule({ timeFormat })
-              : new TimeRequiredRule({ timeFormat })
+              ? new timeRequiredRule.TimeRangeRequiredRule({ timeFormat })
+              : new timeRequiredRule.TimeRequiredRule({ timeFormat })
             : null,
           dependence: ['timeFormat', 'mode'],
         },
@@ -1898,8 +1769,8 @@ const VegaTimePicker = class {
           propertyName: 'timeFormat',
           ruleFactory: (timeFormat, required, mode) => timeFormat && required
             ? mode === 'range'
-              ? new TimeRangeRequiredRule({ timeFormat })
-              : new TimeRequiredRule({ timeFormat })
+              ? new timeRequiredRule.TimeRangeRequiredRule({ timeFormat })
+              : new timeRequiredRule.TimeRequiredRule({ timeFormat })
             : null,
           dependence: ['required', 'mode'],
         },

package/dist/cjs/vega-toggle-switch.cjs.entry.js

@@ -9,7 +9,8 @@ const accessibility = require('./accessibility-bfa227f6.js');
 const component = require('./component-73a88c4e.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-dcb32c24.js');
-const formFieldControllerSlimmer = require('./form-field-controller-slimmer-48c0ad0b.js');
+const formFieldControllerSlimmer = require('./form-field-controller-slimmer-d92e8212.js');
+const toggleSwitchRequiredRule = require('./toggle-switch-required-rule-88a51b36.js');
 const staticSubjectTitle = require('./static-subject-title-c589a1bd.js');
 const changeManager = require('./change-manager-a297e4d2.js');
 require('./ui-5fd9b267.js');
@@ -25,72 +26,12 @@ require('./page-resize-observer-slimmer-bb1eaebe.js');
 require('./breakpoints-17d6c4c7.js');
 require('./ui-32e69595.js');
 require('./breakpoints-ebde4837.js');
+require('./internal-form-field-validation-rule.abstract-07cdff46.js');
 require('./mutation-observer-slimmer-895b3d3e.js');
 require('./mutation-observer-filters-e5a7f85a.js');
 require('./array-5adef7b2.js');
 require('./number-4816603d.js');
 
-/**
- * A rule that checks if toggle switch is required to switch on
- *
- * @implements {FormFieldValidationRule<boolean>}
- */
-class ToggleSwitchRequiredRule {
-  /**
-   * If the input is a boolean, return a boolean. If the
-   * input is anything else, return false
-   *
-   * @param {unknown} input - The input to be evaluated.
-   * @returns {EvaluateResult} - An object with two properties: isValid and message.
-   */
-  evaluate(input) {
-    if (typeof input === 'boolean') {
-      return {
-        isValid: input,
-        message: input ? '' : 'This field is required',
-      };
-    }
-    else {
-      return {
-        isValid: false,
-        message: 'This field is required',
-      };
-    }
-  }
-  /**
-   * If the input is accepted and the status is not disabled and visible, then return true
-   *
-   * @param {unknown} input - The input to be evaluated.
-   * @param {FormFieldStatusMeta} [status] - FormFieldStatusMeta
-   * @returns {boolean} The return value is a boolean that indicates whether the input can be evaluated.
-   */
-  canEvaluate(input, status) {
-    return status
-      ? this.isAcceptedInputType(input) && !status.disabled && status.visible
-      : this.isAcceptedInputType(input);
-  }
-  /**
-   * If the field is not disabled, visible, and has been touched or modified, then show the error
-   *
-   * @param {FormFieldStatusMeta} status - FormFieldStatusMeta
-   * @returns {boolean} A boolean value.
-   */
-  shouldShowError(status) {
-    return !status.disabled && status.visible && (status.touched || status.modified);
-  }
-  /**
-   * If the input is undefined or null, return true, otherwise return true if the input is a boolean.
-   *
-   * @param {unknown} input - The input value to be validated.
-   * @returns {boolean} A boolean.
-   */
-  isAcceptedInputType(input) {
-    if (input === undefined || input === null)
-      return true;
-    return typeof input === 'boolean';
-  }
-}
-
 const vegaToggleSwitchCss = ":host{display:inline-block}:host .vega-error{display:inline-block;padding-left:8px;padding-right:8px;padding-top:12px;font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px;color:rgba(var(--v-text-error, 189, 41, 71, 1))}@media screen and (min-width: 768px) and (max-width: 1023px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){:host .vega-error{font-family:\"Inter\", sans-serif;font-size:14px;font-weight:400;line-height:18px;letter-spacing:0px}}:host .vega-hidden{display:none}div.vega-container{display:flex;justify-content:flex-start;align-items:center;border-radius:9999px;position:relative;box-sizing:content-box;height:24px;width:48px;padding:4px;background-color:rgba(var(--v-bg-toggle-switch, 107, 116, 125, 0.7))}div.vega-container:hover{background-color:rgba(var(--v-bg-toggle-switch-hover, 107, 116, 125, 1))}div.vega-container.vega-container-checked{background-color:rgba(var(--v-bg-action, 19, 98, 226, 1))}div.vega-container.vega-container-checked:hover{background-color:rgba(var(--v-bg-action-hover, 4, 112, 236, 1))}div.vega-container.vega-container-disabled{background-color:rgba(var(--v-bg-disabled, 176, 180, 181, 1))}div.vega-container.vega-container-checked.vega-container-disabled{background-color:rgba(var(--v-bg-toggle-switch-selected-disabled, 153, 192, 255, 1))}div.vega-container-small-size{box-sizing:border-box;height:20px;width:32px;padding:2px}div.vega-container>span{margin-left:0px;transition-property:margin;transition-duration:0.1s;transition-timing-function:linear}div.vega-container:focus-within{box-shadow:0 0 0 4px rgba(var(--v-ring-action-focus, 19, 98, 226, 0.25))}div.vega-container-checked>span{margin-left:24px}div.vega-container-checked.vega-container-small-size>span{margin-left:12px}div.vega-container>input{position:absolute;cursor:pointer;opacity:0;left:0px;top:0px;width:100%;height:100%;margin:0px;-webkit-tap-highlight-color:transparent}div.vega-container input:disabled{cursor:default}div.vega-container>span{display:inline-block;border-radius:9999px;box-shadow:var(--v-shadow-form-field, 0px 1px 2px 0px rgba(0, 0, 0, 0.06), 0px 1px 2px 0px rgba(0, 0, 0, 0.1));width:24px;height:24px;background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));box-shadow:var(--v-shadow-form-field, 0px 1px 2px 0px rgba(0, 0, 0, 0.06), 0px 1px 2px 0px rgba(0, 0, 0, 0.1));transition-property:margin;transition-duration:0.1s;transition-timing-function:linear}div.vega-container-small-size{height:20px}div.vega-container-small-size>span{width:16px;height:16px}div{align-self:center}";
 
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
@@ -114,7 +55,7 @@ const VegaToggleSwitch = class {
       propertyRules: [
         {
           propertyName: 'required',
-          ruleFactory: (isRequired) => isRequired ? new ToggleSwitchRequiredRule() : null,
+          ruleFactory: (isRequired) => isRequired ? new toggleSwitchRequiredRule.ToggleSwitchRequiredRule() : null,
         },
       ],
       validationRulesName: 'validationRules',

package/dist/cjs/vega-tooltip_2.cjs.entry.js

@@ -7,7 +7,7 @@ const component = require('./component-73a88c4e.js');
 const injectKeyboardManager = require('./inject-keyboard-manager-4a5c27a2.js');
 const globalSlimmerRegistry = require('./global-slimmer-registry-b3bce7e0.js');
 const componentUsageRuntimeMetrics = require('./component-usage-runtime-metrics-dcb32c24.js');
-const elementAppenderSlimmer = require('./element-appender-slimmer-c6e0f4ca.js');
+const elementAppenderSlimmer = require('./element-appender-slimmer-4f0dc8c6.js');
 const deprecatedPropertySlimmer = require('./deprecated-property-slimmer-fc729fd9.js');
 require('./keyboard-manager-2df53b2f.js');
 require('./ui-5fd9b267.js');
@@ -42,17 +42,25 @@ class VegaTooltipElementAppenderController extends elementAppenderSlimmer.Elemen
    * This constructor of the tooltip element appender controller.
    */
   constructor() {
-    super(() => ({
-      target: this.host,
-      appendableElement: this.vegaTooltipContentBoxRenderer.getTooltipContentBoxRef(),
-      positionRelativeTo: this.positionRelativeTo,
-      matchTargetWidth: false,
-      size: this.size,
-      minWidth: this.minWidth,
-      maxWidth: this.maxWidth,
-      placement: this.placement,
-      alignment: this.alignment,
-    }), () => this.trigger, 'isTooltipShow', () => this.disableInteractive);
+    super(() => this.getShowConfig(), () => this.trigger, 'isTooltipShow', () => this.disableInteractive);
+    /**
+     * Generate the element appender show config object.
+     *
+     * @returns {ElementAppenderShowConfig} - Show config object.
+     */
+    this.getShowConfig = () => {
+      return {
+        target: this.host,
+        appendableElement: this.vegaTooltipContentBoxRenderer.getTooltipContentBoxRef(),
+        positionRelativeTo: this.positionRelativeTo,
+        matchTargetWidth: false,
+        size: this.size,
+        minWidth: this.minWidth,
+        maxWidth: this.maxWidth,
+        placement: this.placement,
+        alignment: this.alignment,
+      };
+    };
   }
   /**
    * The `watchTrigger` function hides an element if the trigger is set to 'none'.
@@ -70,6 +78,26 @@ class VegaTooltipElementAppenderController extends elementAppenderSlimmer.Elemen
       this.show();
     }
   }
+  /**
+   * Hide the tooltip if the content change to empty.
+   *
+   * @param {string} newText - The property text or content new value.
+   * @param {string} oldText - The property text or content old value.
+   */
+  watchTextChange(newText, oldText) {
+    if (!newText && oldText && this.isTooltipShow) {
+      this.hide();
+    }
+  }
+  /**
+   * Override the parent class `ElementAppenderSlimmer` show method to control the tooltip show according to the tooltip content.
+   */
+  show() {
+    const text = this.deprecatedPropertySlimmer.getValue();
+    if (text) {
+      super.show();
+    }
+  }
 }
 __decorate$3([
   globalSlimmerRegistry.MapToComponentField()
@@ -98,6 +126,9 @@ __decorate$3([
 __decorate$3([
   globalSlimmerRegistry.MapToComponentField()
 ], VegaTooltipElementAppenderController.prototype, "disableInteractive", void 0);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentField()
+], VegaTooltipElementAppenderController.prototype, "deprecatedPropertySlimmer", void 0);
 __decorate$3([
   globalSlimmerRegistry.MapToComponentField({ writable: true })
 ], VegaTooltipElementAppenderController.prototype, "isTooltipShow", void 0);
@@ -110,6 +141,9 @@ __decorate$3([
 __decorate$3([
   globalSlimmerRegistry.MapToComponentMethod('watchToShowTooltip')
 ], VegaTooltipElementAppenderController.prototype, "watchToShowTooltip", null);
+__decorate$3([
+  globalSlimmerRegistry.MapToComponentMethod('watchTextChange')
+], VegaTooltipElementAppenderController.prototype, "watchTextChange", null);
 
 var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -216,6 +250,11 @@ const VegaTooltip = class {
   }
   watchTrigger() {
   }
+  /**
+   * Monitor the property text updates.
+   */
+  watchTextChange() {
+  }
   watchToShowTooltip() {
   }
   render() {
@@ -224,6 +263,8 @@ const VegaTooltip = class {
   get host() { return index.getElement(this); }
   static get watchers() { return {
     "trigger": ["watchTrigger"],
+    "content": ["watchTextChange"],
+    "text": ["watchTextChange"],
     "size": ["watchToShowTooltip"],
     "placement": ["watchToShowTooltip"],
     "alignment": ["watchToShowTooltip"]