@heartlandone/vega 1.6.0 → 1.8.0

package/dist/cjs/{app-globals-82228833.js → app-globals-55277f95.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const featureFlagController = require('./featureFlagController-d092ffce.js');
+const featureFlagController = require('./featureFlagController-8cb35fec.js');
 
 /**
  * Default export function that will be used by stencil global script,

package/dist/cjs/{array-414f6d01.js → array-a4f013ec.js}

@@ -39,7 +39,22 @@ const isArrayEqual = (first, second) => {
 const isObjectArrayLike = (obj) => {
   return Object.keys(obj).every((key) => !isNaN(number.convertToNumber(key)));
 };
+/**
+ * It takes an array and an item, and returns a new array with the item removed at the first occurrence.
+ *
+ * @param {T[]} arr - T[] - The array to remove the item from
+ * @param {T} item - The item to be deleted from the array.
+ * @returns {T[]} A function that takes two arguments, arr and item, and returns an array.
+ */
+const deleteItemFromArray = (arr, item) => {
+  const index = arr.indexOf(item);
+  if (index > -1) {
+    arr.splice(index, 1);
+  }
+  return arr;
+};
 
+exports.deleteItemFromArray = deleteItemFromArray;
 exports.flattenChildren = flattenChildren;
 exports.isArrayEqual = isArrayEqual;
 exports.isObjectArrayLike = isObjectArrayLike;

package/dist/cjs/{featureFlagController-d092ffce.js → featureFlagController-8cb35fec.js}

@@ -14,16 +14,21 @@ const FeatureFlagsMap = {
     createdTimestamp: 1660800418146,
     createdAtVersion: '1.3.0',
   },
-  'VEGA_DATE_PICKER.ADD_DATEPICKER_TO_ELEMENT_APPENDER': {
-    description: `Feature flag to enable add the date picker to element appender`,
-    createdTimestamp: 1662508203840,
-    createdAtVersion: '1.4.0',
-  },
   'VEGA_CHECK_GROUP.VALUE_PROPERTY_TYPE_CHANGE_ARRAY': {
     description: 'Feature flag to enable the change value property to array for the checkbox group component.',
     createdTimestamp: 1661243219291,
     createdAtVersion: '1.3.0',
   },
+  'VEGA_FORM.FORM_FIELD_CONTROLLER_VALIDATION': {
+    description: `Feature flag to enable the new form validation process for the form component.`,
+    createdTimestamp: 1660617211562,
+    createdAtVersion: '1.6.0',
+  },
+  'VEGA_DATE_PICKER.ADD_DATEPICKER_TO_ELEMENT_APPENDER': {
+    description: `Feature flag to enable add the date picker to element appender`,
+    createdTimestamp: 1662508203840,
+    createdAtVersion: '1.4.0',
+  },
 };
 const FeatureFlagsMap$1 = Object.freeze(FeatureFlagsMap);
 

package/dist/cjs/formFieldController-2882fd1f.js

@@ -0,0 +1,468 @@
+'use strict';
+
+const subject = require('./subject-b9a0f7c6.js');
+const ui = require('./ui-1393500e.js');
+
+/**
+ * A rule that checks if a string is empty or not
+ *
+ * @implements {FormFieldValidationRule<string>}
+ */
+class RequiredFieldRule {
+  constructor() {
+    /**
+     * A function that checks if the item is a string, number, or boolean.
+     *
+     * @param {unknown} item - The item to be checked.
+     * @returns {boolean} The return value is a boolean that indicates whether the item is string, number or boolean.
+     */
+    this.checkArrayItemType = (item) => typeof item === 'string' || typeof item === 'number' || typeof item === 'boolean';
+  }
+  /**
+   * If the input is a number or a boolean, return true. If the input is a string, return true if the string is not empty
+   *
+   * @param {Primitive | Array<Primitive>} input - The input to be evaluated.
+   * @returns {EvaluateResult} An object with two properties: isValid and message.
+   */
+  evaluate(input) {
+    if (!this.isAcceptedInputType(input)) {
+      throw new Error(`Unexpected type of input: ${typeof input}: ${input}`);
+    }
+    else if (typeof input === 'number' || typeof input === 'boolean') {
+      return {
+        isValid: true,
+        message: '',
+      };
+    }
+    else if (typeof input === 'string' || Array.isArray(input)) {
+      return {
+        isValid: input.length > 0,
+        message: input.length <= 0 ? 'This field is required' : '',
+      };
+    }
+    else if (input === null) {
+      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 a string, number, boolean, or null, return true, otherwise return false.
+   *
+   * @param {unknown} input - The input value to be validated.
+   * @returns {boolean} a boolean value.
+   */
+  isAcceptedInputType(input) {
+    return (typeof input === 'string' ||
+      typeof input === 'number' ||
+      typeof input === 'boolean' ||
+      (Array.isArray(input) && input.every(this.checkArrayItemType)) ||
+      input === null);
+  }
+}
+
+/**
+ * The FormFieldController class is a class that validates the value of an input elements
+ *
+ * @implements {Validator<number | string | boolean | null>}
+ * @property {FormFieldValidationRule<number | string | boolean>[] = []} defaultRules default rules used for validation
+ * @property {FormFieldValidationRule<number | string | boolean>[]} additionalRules additional rules used for validation
+ * @property {InputValidatorListener[]} listeners listeners monitoring on the validation result
+ * @property {string} inputContainerSelector container that holds the input value
+ * @property {unknown & { value?: number | string | boolean }} hostElement host element used to get the value for validation if input element is not present
+ * @property {boolean} isTouched true if an element is touched
+ * @property {boolean} isModified true if an element is modified
+ * @property {boolean} isVisible true if an element is visible
+ * @property {string} touchableArea define the area which listen to the blur event
+ * @property {MutationObserver} disabledAttrObserver reference to the MutationObserver
+ * @property {ResizeObserver} visibilityObserver reference to the ResizeObserver
+ * @property {Observer<boolean>} formResetTriggeredObserver reference to formResetTriggeredObserver
+ */
+class FormFieldController {
+  /**
+   * This function is called when the component is created, and it sets up the observers that will be used to detect changes to the component's state.
+   * The first thing the constructor does is set the defaultRules, hostElement, inputContainerSelector, touchableArea, isTouched, isModified, and isDisabled properties
+   *
+   * @param {FormFieldValidationRule<number | string | boolean>[]} defaultRules - FormFieldValidationRule<T>[]
+   * @param {FormFieldElement<number | string | boolean>} hostElement - The form field element that this validation manager is attached to.
+   * @param {string} [inputContainer=.vega-input-container] - The selector for the element that contains the input element.
+   * @param {string} [touchableArea=input] - This is the element that will be used to determine if the user has touched the field.
+   */
+  constructor(defaultRules, hostElement, inputContainer = '.vega-input-container', touchableArea = 'input') {
+    var _a, _b;
+    this.defaultRules = [];
+    this.additionalRules = [];
+    this.listeners = [];
+    this.inputContainerSelector = '';
+    this.isTouched = false;
+    this.isModified = false;
+    this.isVisible = false;
+    this.defaultRules = defaultRules;
+    this.hostElement = hostElement;
+    this.inputContainerSelector = inputContainer;
+    this.touchableArea = touchableArea;
+    this.initDisabledAttrObserver();
+    this.initResizeObserver();
+    this.initFormResetObserver();
+    (_b = (_a = this.hostElement).componentOnReady) === null || _b === void 0 ? void 0 : _b.call(_a).then(() => {
+      this.didRender();
+    });
+  }
+  /**
+   * Get the default value of the form field
+   *
+   * @param {HTMLElement} element Form field element
+   * @returns { '' | 0 | ['', ''] } The default value
+   */
+  static getFormFieldDefaultValue(element) {
+    const tagName = element.tagName;
+    if (tagName === 'VEGA-INPUT-SELECT' ||
+      tagName === 'VEGA-CHECKBOX-GROUP' ||
+      tagName === 'VEGA-RADIO-GROUP')
+      return '';
+    if (tagName === 'VEGA-INPUT') {
+      return element.dataset['isVegaStepper'] ? 0 : '';
+    }
+    if (tagName === 'VEGA-DATE-PICKER') {
+      if (element['mode'] === 'range') {
+        return ['', ''];
+      }
+      else {
+        return '';
+      }
+    }
+    if (tagName === 'VEGA-STEPPER') {
+      return 0;
+    }
+  }
+  /**
+   * It validates the input against the rules and returns a boolean indicating whether the input is valid or not
+   *
+   * @param {boolean} showError whether the validation result should be reflected in UI
+   * @returns {boolean} A boolean value.
+   */
+  validate(showError) {
+    return this.valid([], showError);
+  }
+  /**
+   * This function adds a listener to the listeners array.
+   *
+   * @param {InputValidatorListener} listener - The listener to add.
+   */
+  addListener(listener) {
+    this.listeners.push(listener);
+  }
+  /**
+   * It returns an array of all the validation rules for the field
+   *
+   * @returns {FormFieldValidationRule<number | string | boolean>[]} An array of FormFieldValidationRule<T>
+   */
+  getRules() {
+    return [...this.defaultRules, ...this.additionalRules];
+  }
+  /**
+   * Set the default rules for the form field.
+   *
+   * @param {FormFieldValidationRule<number | string | boolean>[]} rules - FormFieldValidationRule<T>[]
+   */
+  setDefaultRules(rules) {
+    this.defaultRules = rules;
+  }
+  /**
+   * This function sets the additional rules for the form field
+   *
+   * @param {FormFieldValidationRule<number | string | boolean>[]} rules - The rules that are required for the field to be valid.
+   */
+  setAdditionalRules(rules) {
+    this.additionalRules = rules;
+  }
+  /**
+   * Return true if any of the rules are an instance of the RequiredFieldRule class.
+   *
+   * @returns {boolean} A boolean value.
+   */
+  hasRequiredRule() {
+    return this.getRules().some((rule) => rule instanceof RequiredFieldRule);
+  }
+  /**
+   * The destroy function unregister the form reset observer
+   */
+  destroy() {
+    this.unregisterFormResetObserver();
+  }
+  /**
+   * valid function to validate the rules
+   */
+  valid(triggerStatus, showError = 'rule') {
+    const input = this.hostElement.value;
+    const firstInvalidResult = this.getFirstInvalidRuleResult(input, triggerStatus);
+    let isValid = true;
+    if (firstInvalidResult) {
+      if (showError === 'rule') {
+        firstInvalidResult.shouldShowError
+          ? this.applyInputInvalidUI(firstInvalidResult.message)
+          : this.resetInputInvalidUI();
+      }
+      else {
+        showError ? this.applyInputInvalidUI(firstInvalidResult.message) : this.resetInputInvalidUI();
+      }
+      isValid = false;
+    }
+    else {
+      this.resetInputInvalidUI();
+    }
+    this.invokeListeners(isValid);
+    return isValid;
+  }
+  /**
+   * It returns the first invalid rule result, or null if all rules are valid
+   *
+   * @param {number | string | boolean | string[] | null} input - The current value of the field
+   * @param {(keyof FormFieldStatusMeta)[]} statusChanged - (keyof FormFieldStatusMeta)[]
+   * @returns {ValidationResult | null} The first invalid rule result.
+   */
+  getFirstInvalidRuleResult(input, statusChanged) {
+    const status = this.getStatus();
+    for (const rule of this.getRules().filter((rule) => rule.canEvaluate(input, status, statusChanged))) {
+      const evaluateResult = rule.evaluate(input);
+      const shouldShowError = rule.shouldShowError
+        ? rule.shouldShowError(status, statusChanged)
+        : this.defaultShouldShowError(status);
+      const validationResult = Object.assign(Object.assign({}, evaluateResult), { shouldShowError });
+      if (!evaluateResult.isValid) {
+        return validationResult;
+      }
+    }
+    return null;
+  }
+  /**
+   * It takes an error message and displays it in the error container
+   *
+   * @param {string} errorMessage - The error message to display.
+   */
+  applyInputInvalidUI(errorMessage) {
+    if (errorMessage) {
+      const inputContainer = this.getInputElementContainer();
+      const errorContainer = this.getErrorContainer();
+      errorContainer.innerHTML = errorMessage;
+      errorContainer.classList.remove('vega-hidden');
+      inputContainer.classList.add('error');
+    }
+  }
+  /**
+   * Reset the input element's invalid UI
+   */
+  resetInputInvalidUI() {
+    const inputContainer = this.getInputElementContainer();
+    const errorContainer = this.getErrorContainer();
+    errorContainer.classList.add('vega-hidden');
+    inputContainer.classList.remove('error');
+  }
+  /**
+   * Get the input element container
+   *
+   * @returns {HTMLElement} The input element container.
+   */
+  getInputElementContainer() {
+    const inputContainer = this.hostElement.querySelector(this.inputContainerSelector);
+    if (!inputContainer) {
+      throw new Error(`Can't not find inputContainer with selector ${this.inputContainerSelector}`);
+    }
+    return inputContainer;
+  }
+  /**
+   * Get the error container, if it doesn't exist, create it
+   *
+   * @returns {HTMLElement} The error container.
+   */
+  getErrorContainer() {
+    var _a;
+    const inputContainer = this.getInputElementContainer();
+    let siblingContainer = inputContainer.nextSibling;
+    if (!siblingContainer || !((_a = siblingContainer.classList) === null || _a === void 0 ? void 0 : _a.contains('vega-error'))) {
+      siblingContainer = document.createElement('label');
+      siblingContainer.classList.add('vega-error');
+      inputContainer.after(siblingContainer);
+    }
+    return siblingContainer;
+  }
+  /**
+   * Invoke all listeners with the given isValid value
+   *
+   * @param {boolean} isValid - boolean
+   */
+  invokeListeners(isValid) {
+    this.listeners.forEach((listener) => listener.callback(isValid));
+  }
+  /**
+   * It returns an object with the current status of the form field
+   *
+   * @returns {FormFieldStatusMeta} The status of the form field.
+   */
+  getStatus() {
+    return {
+      touched: this.isTouched,
+      modified: this.isModified,
+      disabled: this.hostElement['disabled'],
+      visible: this.isVisible,
+    };
+  }
+  /**
+   * It updates the `isTouched` property and if auto validation is enabled, it validates the input
+   *
+   * @param {boolean} touched - boolean - whether the input is touched or not
+   */
+  updateIsTouched(touched) {
+    const prevIsTouched = this.isTouched;
+    this.isTouched = touched;
+    if (this.isAutoValidationEnabled()) {
+      this.valid(prevIsTouched === touched ? [] : ['touched']);
+    }
+  }
+  /**
+   * "If the value of the `isModified` property has changed, then update the `isModified` property and if auto-validation is enabled, then validate the control."
+   *
+   * @param {boolean} modified - boolean - whether the value has been modified or not
+   */
+  updateIsModified(modified) {
+    const prevIsModified = this.isModified;
+    this.isModified = modified;
+    if (this.isAutoValidationEnabled()) {
+      this.valid(prevIsModified === modified ? [] : ['modified']);
+    }
+  }
+  /**
+   * It creates a new MutationObserver that watches for changes to the disabled attribute of the host
+   * element, and when it detects a change, it validates the host element's value
+   */
+  initDisabledAttrObserver() {
+    this.disabledAttrObserver = new MutationObserver(() => {
+      if (this.isAutoValidationEnabled()) {
+        this.valid(['disabled']);
+      }
+    });
+    this.disabledAttrObserver.observe(this.hostElement, {
+      attributes: true,
+      attributeFilter: ['disabled'],
+    });
+  }
+  /**
+   * It creates an observer that will watch the host element and set the isVisible property to true if
+   * the element is visible.
+   */
+  initResizeObserver() {
+    this.resizeObserver = new ResizeObserver((entries) => {
+      const prevVisible = this.isVisible;
+      const currentVisible = entries[0].contentRect.height > 0;
+      this.isVisible = currentVisible;
+      if (this.isAutoValidationEnabled() && ui.findParent(this.hostElement, 'vega-form')) {
+        prevVisible !== currentVisible && this.valid(['visible']);
+      }
+    });
+    this.resizeObserver.observe(this.hostElement);
+  }
+  /**
+   * If the input form is a child of the current form, then the current form can accept the input form's reset operation
+   *
+   * @param {ResetOperationPayload} input - VegaForm - The form that is being reset.
+   * @returns {boolean} A boolean value.
+   */
+  canAcceptFormResetOperation(input) {
+    return ui.findParent(this.hostElement, 'vega-form') === input.host;
+  }
+  /**
+   * Unregister the form reset observer.
+   */
+  unregisterFormResetObserver() {
+    subject.ChangeManager.unregister(subject.FORM_RESET_OPERATION_TRIGGERED, this.formResetTriggeredObserver);
+  }
+  /**
+   * It adds a blur event listener to all elements that match the selector in the touchableArea property
+   */
+  setupTouchedListener() {
+    this.hostElement.querySelectorAll(this.touchableArea).forEach((item) => item.addEventListener('blur', () => {
+      this.updateIsTouched(true);
+    }));
+  }
+  /**
+   * It adds an event listener to the host element that listens for a custom event called `vegaChange`.
+   * When that event is fired, the `updateIsModified` function is called with the argument `true`
+   */
+  setupModifiedListener() {
+    this.hostElement.addEventListener('vegaChange', () => {
+      this.updateIsModified(true);
+    });
+  }
+  /**
+   * It resets the form field's status and then validates the form field with the current value
+   */
+  reset(payload) {
+    const fieldName = this.hostElement.dataset['vegaForm'];
+    const defaultValue = payload.defaultValueMap[fieldName] === undefined || payload.defaultValueMap[fieldName] === null
+      ? FormFieldController.getFormFieldDefaultValue(this.hostElement)
+      : payload.defaultValueMap[fieldName];
+    this.hostElement.value = defaultValue;
+    this.isTouched = false;
+    this.isModified = false;
+    this.resetInputInvalidUI();
+  }
+  /**
+   * This function is called after the component has been rendered. It re-attaches the invalid UI to
+   * the input element, and sets up the listeners for the `touched` and `modified` events
+   */
+  didRender() {
+    this.setupTouchedListener();
+    this.setupModifiedListener();
+  }
+  /**
+   * This function registers an observer with the ChangeManager that will be notified when a form
+   * reset operation is triggered
+   */
+  initFormResetObserver() {
+    this.formResetTriggeredObserver = new subject.Observer(this.canAcceptFormResetOperation.bind(this), this.reset.bind(this));
+    subject.ChangeManager.register(subject.FORM_RESET_OPERATION_TRIGGERED, this.formResetTriggeredObserver);
+  }
+  /**
+   * "If the host element's autoValidation property is not false, then return true."
+   * The host element is the element that the directive is attached to. In this case, the host element is the input element
+   *
+   * @returns {boolean} A boolean value.
+   */
+  isAutoValidationEnabled() {
+    return this.hostElement.autoValidation !== false;
+  }
+  /**
+   * If the field is not disabled, visible, and the field is touched or modified, then return true
+   *
+   * @param {FormFieldStatusMeta} status - FormFieldStatusMeta - The status of the field.
+   * @returns {boolean} A function that takes in 3 parameters and returns a boolean.
+   */
+  defaultShouldShowError(status) {
+    return !status.disabled && status.visible && (status.touched || status.modified);
+  }
+}
+
+exports.FormFieldController = FormFieldController;
+exports.RequiredFieldRule = RequiredFieldRule;

package/dist/cjs/index.cjs.js

@@ -7,7 +7,7 @@ const log = require('./log-7b0974fb.js');
 const typeGuard = require('./typeGuard-7a5746f7.js');
 const icons = require('./icons-5a6aca4a.js');
 const ui = require('./ui-2ae913d5.js');
-const featureFlagController = require('./featureFlagController-d092ffce.js');
+const featureFlagController = require('./featureFlagController-8cb35fec.js');
 require('./number-2eb7b8f3.js');
 
 /* This file is generated by vega-design 2.0.64 */

package/dist/cjs/loader.cjs.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-c12bc235.js');
-const appGlobals = require('./app-globals-82228833.js');
-require('./featureFlagController-d092ffce.js');
+const appGlobals = require('./app-globals-55277f95.js');
+require('./featureFlagController-8cb35fec.js');
 
 /*
  Stencil Client Patch Esm v2.17.4 | MIT Licensed | https://stenciljs.com
@@ -17,7 +17,7 @@ const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
   appGlobals.globalScripts();
-  return index.bootstrapLazy([["vega-button_22.cjs",[[0,"vega-tab-group",{"selectedTabDataTarget":[1,"selected-tab-data-target"],"gap":[1],"showCloseButton":[4,"show-close-button"],"tabItems":[16],"positionRelativeTo":[1,"position-relative-to"],"tabPages":[32],"tabWidthArray":[32],"currentPageIndex":[32]},[[0,"vegaPageUpdate","onCarouselPageUpdate"]]],[4,"vega-table",{"columns":[16],"dataSource":[16],"rowSelection":[1040],"rowExpandable":[4,"row-expandable"],"rowClickable":[4,"row-clickable"],"rowDivider":[4,"row-divider"],"columnDivider":[4,"column-divider"],"striped":[4],"density":[1],"paddingX":[16],"showHeader":[4,"show-header"],"pagination":[16],"selectedRowKeySet":[32],"expandedRowKeySet":[32],"currentBreakpoint":[32],"sortersMap":[32],"currentData":[32],"currentClickedRowIndex":[32],"currentPage":[32],"openExpandRow":[64],"closeExpandRow":[64],"closeAllExpandRow":[64],"toggleExpandRow":[64],"clearSelection":[64],"getSelection":[64],"setSelection":[64]}],[0,"vega-date-picker",{"mode":[1],"value":[1537],"label":[1],"required":[4],"isValid":[1540,"is-valid"],"autoValidation":[516,"auto-validation"],"format":[1],"size":[1],"formValidation":[2,"form-validation"],"validationRules":[16],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"placeholder":[1],"clearButton":[4,"clear-button"],"readOnly":[4,"read-only"],"allowRepick":[4,"allow-repick"],"dropdownConfig":[16],"disabled":[4],"valid":[64],"doClose":[64],"doOpen":[64]}],[0,"vega-input-select",{"label":[1],"required":[1028],"source":[1040],"value":[1537],"isValid":[1540,"is-valid"],"autoValidation":[4,"auto-validation"],"formValidation":[2,"form-validation"],"validationRules":[16],"prefixIcon":[1,"prefix-icon"],"disabled":[4],"placeholder":[1],"hint":[1],"vegaDropdownProps":[16],"isDropdownShow":[32],"showError":[32],"doClose":[64],"doOpen":[64],"doChange":[64],"valid":[64]}],[0,"vega-progress-tracker",{"direction":[1],"steps":[16],"completedStepArray":[16],"canClickStep":[4,"can-click-step"],"current":[32],"nextStep":[64],"prevStep":[64],"setCurrent":[64],"getCurrent":[64]},[[0,"vegaPageUpdate","onVegaPageUpdateHandler"]]],[4,"vega-sidenav",{"source":[16],"footnote":[1],"headerConfig":[16],"openByDefault":[1,"open-by-default"],"openState":[32],"toggle":[64]},[[0,"vegaClick","onVegaClickHandler"],[10,"click","collapseSidenavByBackDropClick"]]],[0,"vega-button",{"size":[1],"variant":[1],"icon":[1],"iconAlign":[1,"icon-align"],"label":[1025],"disabled":[4],"danger":[4],"block":[4]}],[4,"vega-footer",{"tosUrl":[1,"tos-url"],"privacyUrl":[1,"privacy-url"]}],[4,"vega-modal",{"backdrop":[1],"size":[8],"open":[1028],"animation":[4],"modalTitle":[1,"modal-title"],"backdropColor":[1,"backdrop-color"],"isVerticallyCenter":[4,"is-vertically-center"],"showCloseButton":[4,"show-close-button"],"padding":[1],"contentMaxHeight":[2,"content-max-height"],"modal":[64]},[[10,"click","listenDataTarget"],[0,"click","listenDataDismiss"]]],[0,"vega-pagination",{"current":[1538],"total":[2],"pageSize":[2,"page-size"]}],[0,"vega-button-link",{"link":[1],"size":[1],"icon":[513],"iconType":[1,"icon-type"],"iconAlign":[1,"icon-align"],"label":[1025],"disabled":[4],"danger":[4],"eventful":[4]}],[4,"vega-checkbox",{"value":[1],"name":[1],"checked":[1028],"disabled":[4],"size":[1]}],[4,"vega-sidenav-group",{"icon":[1],"label":[1]}],[4,"vega-sidenav-link",{"icon":[1],"selected":[1540],"url":[1],"showSideBarOnClickLink":[4,"show-side-bar-on-click-link"]}],[4,"vega-dropdown",{"size":[8],"trigger":[1],"translocation":[16],"source":[1040],"positionRelativeTo":[1,"position-relative-to"],"selectType":[1,"select-type"],"selectedSourceKey":[1025,"selected-source-key"],"maxHeight":[2,"max-height"],"searchable":[4],"matchTargetWidth":[4,"match-target-width"],"matchContainerHeight":[4,"match-container-height"],"caseSensitive":[4,"case-sensitive"],"searchString":[32],"show":[64],"hide":[64]},[[1,"mouseenter","onMouseEnter"],[0,"click","onClick"],[9,"mousedown","onMouseDown"]]],[4,"vega-carousel",{"perPage":[8,"per-page"],"showSlider":[4,"show-slider"],"spacing":[1],"page":[32],"totalPages":[32],"nextPage":[64],"prevPage":[64],"goToPage":[64]}],[4,"vega-grid",{"column":[2],"row":[2],"gap":[1]}],[0,"vega-input",{"inputId":[513,"id"],"label":[1],"value":[1537],"type":[1],"autocomplete":[1],"prefixIcon":[1,"prefix-icon"],"email":[4],"required":[1028],"min":[2],"max":[2],"minLength":[2,"min-length"],"maxLength":[2,"max-length"],"showClearIcon":[4,"show-clear-icon"],"isValid":[1540,"is-valid"],"autoValidation":[516,"auto-validation"],"formValidation":[2,"form-validation"],"validationRules":[16],"size":[1],"placeholder":[1],"disabled":[4],"hint":[1],"maskConfig":[16],"valid":[64]},[[0,"input","handleValueInput"]]],[0,"vega-button-circle",{"size":[1],"variant":[1],"icon":[513],"label":[1],"disabled":[4],"danger":[4]}],[4,"vega-tooltip",{"size":[8],"trigger":[1],"content":[1],"placement":[1],"positionRelativeTo":[1,"position-relative-to"]},[[0,"click","onClick"],[1,"mouseenter","onMouseEnter"],[1,"mouseleave","onMouseLeave"],[8,"keyup","onKeyDown"],[9,"mousedown","onMouseDown"]]],[0,"vega-flex",{"gap":[1],"margin":[1],"breakpoint":[1],"direction":[1],"alignItem":[1,"align-item"],"justifyContent":[1,"justify-content"]}],[0,"vega-icon",{"icon":[513],"size":[1]}]]],["vega-accordion.cjs",[[4,"vega-accordion",{"drawsBackground":[4,"draws-background"],"prefixIcon":[1,"prefix-icon"],"accordionTitle":[1,"accordion-title"],"expandIconAlign":[1,"expand-icon-align"],"expand":[1028],"showExpandIcon":[4,"show-expand-icon"],"groupId":[1,"group-id"]}]]],["vega-stepper.cjs",[[0,"vega-stepper",{"stepperId":[513,"id"],"max":[2],"min":[2],"value":[1538],"label":[1],"disabled":[4],"required":[4],"isValid":[1028,"is-valid"],"formValidation":[2,"form-validation"],"valid":[64]},[[0,"vegaChange","handleValueChange"],[0,"vegaValidate","handleVegaInputValidate"]]]]],["vega-item-toggle.cjs",[[0,"vega-item-toggle",{"itemToggleStatusMap":[16],"isToggled":[1028,"is-toggled"],"isError":[4,"is-error"],"toggleStatus":[32]}]]],["vega-option.cjs",[[4,"vega-option",{"label":[1],"subLabel":[1,"sub-label"],"icon":[1]},[[2,"vegaFocus","handleFocus"],[2,"vegaBlur","handleBlur"],[3,"mousedown","handleMousedown"],[3,"mouseup","handleMouseup"],[3,"mouseout","handleMouseout"],[2,"click","handleClick"]]]]],["vega-checkbox-group.cjs",[[4,"vega-checkbox-group",{"label":[1],"value":[1025],"name":[1],"vegaFlexProp":[16],"disabled":[4],"required":[4],"hint":[1],"formValidation":[2,"form-validation"],"isValid":[1540,"is-valid"],"valid":[64]},[[0,"vegaChange","changeValue"]]]]],["vega-header.cjs",[[4,"vega-header",{"menuShown":[32]}]]],["vega-radio-group.cjs",[[4,"vega-radio-group",{"label":[1],"value":[1025],"name":[1],"vegaFlexProp":[16],"required":[4],"hint":[1],"formValidation":[2,"form-validation"],"isValid":[1540,"is-valid"],"valid":[64]},[[0,"vegaChange","changeValue"]]]]],["vega-toggle-switch.cjs",[[0,"vega-toggle-switch",{"checked":[1540],"size":[1],"label":[1],"disabled":[4]}]]],["vega-app-footer.cjs",[[0,"vega-app-footer",{"tosUrl":[1,"tos-url"],"privacyUrl":[1,"privacy-url"],"showDisclaimer":[4,"show-disclaimer"]}]]],["vega-badge.cjs",[[0,"vega-badge",{"bgColor":[1,"bg-color"],"textColor":[1,"text-color"],"text":[1],"size":[1]}]]],["vega-form.cjs",[[1,"vega-form",{"isValid":[1028,"is-valid"],"isTouched":[1028,"is-touched"],"valid":[64],"getValue":[64],"setValue":[64],"reset":[64]},[[0,"vegaValidate","updateInternalValidStatus"],[0,"vegaChange","updateInternalTouchedStatus"]]]]],["vega-radio.cjs",[[4,"vega-radio",{"value":[1025],"name":[1],"checked":[4],"disabled":[4]}]]],["vega-card.cjs",[[4,"vega-card",{"padding":[1],"margin":[1],"shadow":[1],"backgroundColor":[1,"background-color"]}]]]], options);
+  return index.bootstrapLazy([["vega-button_22.cjs",[[0,"vega-tab-group",{"selectedTabDataTarget":[1,"selected-tab-data-target"],"gap":[1],"showCloseButton":[4,"show-close-button"],"tabItems":[16],"positionRelativeTo":[1,"position-relative-to"],"tabPages":[32],"tabWidthArray":[32],"currentPageIndex":[32]},[[0,"vegaPageUpdate","onCarouselPageUpdate"]]],[4,"vega-table",{"columns":[16],"dataSource":[16],"rowSelection":[1040],"rowExpandable":[4,"row-expandable"],"rowClickable":[4,"row-clickable"],"rowDivider":[4,"row-divider"],"columnDivider":[4,"column-divider"],"striped":[4],"density":[1],"paddingX":[16],"showHeader":[4,"show-header"],"pagination":[16],"emptyDescription":[1,"empty-description"],"selectedRowKeySet":[32],"expandedRowKeySet":[32],"currentBreakpoint":[32],"sortersMap":[32],"currentData":[32],"currentClickedRowIndex":[32],"currentPage":[32],"openExpandRow":[64],"closeExpandRow":[64],"closeAllExpandRow":[64],"toggleExpandRow":[64],"clearSelection":[64],"getSelection":[64],"setSelection":[64]}],[0,"vega-date-picker",{"mode":[1],"value":[1537],"label":[1],"required":[4],"isValid":[1540,"is-valid"],"autoValidation":[516,"auto-validation"],"format":[1],"size":[1],"formValidation":[2,"form-validation"],"validationRules":[16],"minDate":[1,"min-date"],"maxDate":[1,"max-date"],"placeholder":[1],"clearButton":[4,"clear-button"],"readOnly":[4,"read-only"],"allowRepick":[4,"allow-repick"],"dropdownConfig":[16],"disabled":[516],"valid":[64],"doClose":[64],"doOpen":[64]}],[0,"vega-input-select",{"label":[1],"required":[1028],"source":[1040],"value":[1537],"isValid":[1540,"is-valid"],"autoValidation":[4,"auto-validation"],"formValidation":[2,"form-validation"],"validationRules":[16],"prefixIcon":[1,"prefix-icon"],"disabled":[516],"placeholder":[1],"hint":[1],"vegaDropdownProps":[16],"isDropdownShow":[32],"doClose":[64],"doOpen":[64],"doChange":[64],"valid":[64]}],[0,"vega-progress-tracker",{"direction":[1],"steps":[16],"completedStepArray":[16],"canClickStep":[4,"can-click-step"],"current":[32],"nextStep":[64],"prevStep":[64],"setCurrent":[64],"getCurrent":[64]},[[0,"vegaPageUpdate","onVegaPageUpdateHandler"]]],[4,"vega-sidenav",{"source":[16],"footnote":[1],"headerConfig":[16],"openByDefault":[1,"open-by-default"],"openState":[32],"toggle":[64]},[[0,"vegaClick","onVegaClickHandler"],[10,"click","collapseSidenavByBackDropClick"]]],[0,"vega-button",{"size":[1],"variant":[1],"icon":[1],"iconAlign":[1,"icon-align"],"label":[1025],"disabled":[4],"danger":[4],"block":[4]}],[4,"vega-footer",{"tosUrl":[1,"tos-url"],"privacyUrl":[1,"privacy-url"]}],[4,"vega-modal",{"backdrop":[1],"size":[8],"open":[1028],"animation":[4],"modalTitle":[1,"modal-title"],"backdropColor":[1,"backdrop-color"],"isVerticallyCenter":[4,"is-vertically-center"],"showCloseButton":[4,"show-close-button"],"padding":[1],"contentMaxHeight":[2,"content-max-height"],"modal":[64]},[[10,"click","listenDataTarget"],[0,"click","listenDataDismiss"]]],[0,"vega-pagination",{"current":[1538],"total":[2],"pageSize":[2,"page-size"]}],[0,"vega-button-link",{"link":[1],"size":[1],"icon":[513],"iconType":[1,"icon-type"],"iconAlign":[1,"icon-align"],"label":[1025],"disabled":[4],"danger":[4],"eventful":[4]}],[4,"vega-checkbox",{"value":[1],"name":[1],"checked":[1028],"disabled":[4],"size":[1]}],[4,"vega-sidenav-group",{"icon":[1],"label":[1]}],[4,"vega-sidenav-link",{"icon":[1],"selected":[1540],"url":[1],"showSideBarOnClickLink":[4,"show-side-bar-on-click-link"]}],[4,"vega-dropdown",{"size":[8],"trigger":[1],"translocation":[16],"source":[1040],"positionRelativeTo":[1,"position-relative-to"],"selectType":[1,"select-type"],"selectedSourceKey":[1025,"selected-source-key"],"maxHeight":[2,"max-height"],"searchable":[4],"matchTargetWidth":[4,"match-target-width"],"matchContainerHeight":[4,"match-container-height"],"caseSensitive":[4,"case-sensitive"],"searchString":[32],"show":[64],"hide":[64]},[[1,"mouseenter","onMouseEnter"],[0,"click","onClick"],[9,"mousedown","onMouseDown"]]],[4,"vega-carousel",{"perPage":[8,"per-page"],"showSlider":[4,"show-slider"],"spacing":[1],"page":[32],"totalPages":[32],"nextPage":[64],"prevPage":[64],"goToPage":[64]}],[4,"vega-grid",{"column":[2],"row":[2],"gap":[1]}],[0,"vega-input",{"inputId":[513,"id"],"label":[1],"value":[1537],"type":[1],"autocomplete":[1],"prefixIcon":[1,"prefix-icon"],"email":[4],"required":[1028],"min":[2],"max":[2],"minLength":[2,"min-length"],"maxLength":[2,"max-length"],"showClearIcon":[4,"show-clear-icon"],"isValid":[1540,"is-valid"],"autoValidation":[516,"auto-validation"],"formValidation":[2,"form-validation"],"validationRules":[16],"size":[1],"placeholder":[1],"disabled":[516],"hint":[1],"maskConfig":[16],"valid":[64]},[[0,"input","handleValueInput"]]],[0,"vega-button-circle",{"size":[1],"variant":[1],"icon":[513],"label":[1],"disabled":[4],"danger":[4]}],[4,"vega-tooltip",{"size":[8],"trigger":[1],"content":[1],"placement":[1],"positionRelativeTo":[1,"position-relative-to"]},[[0,"click","onClick"],[1,"mouseenter","onMouseEnter"],[1,"mouseleave","onMouseLeave"],[8,"keyup","onKeyDown"],[9,"mousedown","onMouseDown"]]],[0,"vega-flex",{"gap":[1],"margin":[1],"breakpoint":[1],"direction":[1],"alignItem":[1,"align-item"],"justifyContent":[1,"justify-content"]}],[0,"vega-icon",{"icon":[513],"size":[1]}]]],["vega-accordion.cjs",[[4,"vega-accordion",{"drawsBackground":[4,"draws-background"],"prefixIcon":[1,"prefix-icon"],"accordionTitle":[1,"accordion-title"],"expandIconAlign":[1,"expand-icon-align"],"expand":[1028],"showExpandIcon":[4,"show-expand-icon"],"groupId":[1,"group-id"]}]]],["vega-stepper.cjs",[[0,"vega-stepper",{"stepperId":[513,"id"],"max":[2],"min":[2],"value":[1538],"label":[1],"inputEditable":[4,"input-editable"],"disabled":[516],"required":[4],"isValid":[1028,"is-valid"],"formValidation":[2,"form-validation"],"valid":[64]},[[0,"vegaChange","handleValueChange"],[0,"vegaValidate","handleVegaInputValidate"]]]]],["vega-item-toggle.cjs",[[0,"vega-item-toggle",{"itemToggleStatusMap":[16],"isToggled":[1028,"is-toggled"],"isError":[4,"is-error"],"toggleStatus":[32]}]]],["vega-option.cjs",[[4,"vega-option",{"label":[1],"subLabel":[1,"sub-label"],"icon":[1]},[[2,"vegaFocus","handleFocus"],[2,"vegaBlur","handleBlur"],[3,"mousedown","handleMousedown"],[3,"mouseup","handleMouseup"],[3,"mouseout","handleMouseout"],[2,"click","handleClick"]]]]],["vega-checkbox-group.cjs",[[4,"vega-checkbox-group",{"label":[1],"value":[16],"name":[1],"vegaFlexProp":[16],"disabled":[516],"required":[4],"hint":[1],"formValidation":[2,"form-validation"],"isValid":[1028,"is-valid"],"valid":[64]},[[0,"vegaChange","changeValue"]]]]],["vega-header.cjs",[[4,"vega-header",{"menuShown":[32]}]]],["vega-radio-group.cjs",[[4,"vega-radio-group",{"label":[1],"value":[1025],"name":[1],"vegaFlexProp":[16],"required":[4],"hint":[1],"formValidation":[2,"form-validation"],"isValid":[1028,"is-valid"],"disabled":[4],"valid":[64]},[[0,"vegaChange","changeValue"]]]]],["vega-toggle-switch.cjs",[[0,"vega-toggle-switch",{"checked":[1540],"size":[1],"label":[1],"disabled":[4]}]]],["vega-app-footer.cjs",[[0,"vega-app-footer",{"tosUrl":[1,"tos-url"],"privacyUrl":[1,"privacy-url"],"showDisclaimer":[4,"show-disclaimer"]}]]],["vega-badge.cjs",[[0,"vega-badge",{"bgColor":[1,"bg-color"],"textColor":[1,"text-color"],"text":[1],"size":[1]}]]],["vega-form.cjs",[[1,"vega-form",{"isValid":[1028,"is-valid"],"isTouched":[1028,"is-touched"],"valid":[64],"getValue":[64],"setValue":[64],"reset":[64]},[[0,"vegaValidate","updateInternalValidStatus"],[0,"vegaChange","updateInternalTouchedStatus"]]]]],["vega-radio.cjs",[[4,"vega-radio",{"value":[1],"name":[1],"checked":[4],"disabled":[4]}]]],["vega-card.cjs",[[4,"vega-card",{"padding":[1],"margin":[1],"shadow":[1],"backgroundColor":[1,"background-color"]}]]]], options);
   });
 };
 

package/dist/cjs/{subject-fdccaa01.js → subject-b9a0f7c6.js}

@@ -67,6 +67,35 @@ class ChangeManager {
 }
 const ChangeManager$1 = new ChangeManager();
 
+/**
+ *  An Observer is a class that has a listener method that accepts a value of type T
+ *  and calls the listener method with a value of type T
+ */
+class Observer {
+  /**
+   * It accepts a function that accepts a value and returns a boolean, and a function that accepts a value of the type that
+   * the first function accepts
+   *
+   * @typedef T generic type parameter
+   * @param {(input: unknown) => input is T} accept - A function that indicate if the input is acceptable by the observer
+   * @param {(input: T) => void} listener - A function handle the input for the observer if the input is accepted
+   */
+  constructor(accept, listener) {
+    this.accept = accept;
+    this.listener = listener;
+  }
+  /**
+   * If the input is of the type that this handler is interested in, then call the listener function
+   *
+   * @param {unknown} input - unknown
+   */
+  notify(input) {
+    if (this.accept(input)) {
+      this.listener(input);
+    }
+  }
+}
+
 /**
  * A subject class is used for register by observer
  */
@@ -91,8 +120,11 @@ class Subject {
 const SIDENAV_LINK_SELECTED_TOPIC = new Subject('SIDENAV_LINK_SELECTED_TOPIC');
 const ACCORDION_EXPAND_TOPIC = new Subject('ACCORDION_EXPAND_TOPIC');
 const FORM_CONTROLLED_FIELD_DISABLED_STATUS_CHANGE = new Subject('FORM_CONTROLLED_FIELD_DISABLED_STATUS_CHANGE');
+const FORM_RESET_OPERATION_TRIGGERED = new Subject('FORM_RESET_OPERATION_TRIGGERED');
 
 exports.ACCORDION_EXPAND_TOPIC = ACCORDION_EXPAND_TOPIC;
 exports.ChangeManager = ChangeManager$1;
 exports.FORM_CONTROLLED_FIELD_DISABLED_STATUS_CHANGE = FORM_CONTROLLED_FIELD_DISABLED_STATUS_CHANGE;
+exports.FORM_RESET_OPERATION_TRIGGERED = FORM_RESET_OPERATION_TRIGGERED;
+exports.Observer = Observer;
 exports.SIDENAV_LINK_SELECTED_TOPIC = SIDENAV_LINK_SELECTED_TOPIC;