@heartlandone/vega 1.5.0 → 1.6.0

package/dist/cjs/{app-globals-2bf8bcb4.js → app-globals-82228833.js}

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

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

@@ -19,6 +19,11 @@ const FeatureFlagsMap = {
     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',
+  },
 };
 const FeatureFlagsMap$1 = Object.freeze(FeatureFlagsMap);
 

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-a3377c0c.js');
+const featureFlagController = require('./featureFlagController-d092ffce.js');
 require('./number-2eb7b8f3.js');
 
 /* This file is generated by vega-design 2.0.64 */

package/dist/cjs/{inputValidator-27df89b1.js → inputValidator-4485dcb4.js}

@@ -27,10 +27,19 @@ const debounce = (fn, delay, context) => {
  * @implements {ValidationRule<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 {number | string | boolean} input - The input to be evaluated.
+   * @param {Primitive | Array<Primitive>} input - The input to be evaluated.
    * @returns {EvaluateResult} An object with two properties: isValid and message.
    */
   evaluate(input) {
@@ -43,7 +52,7 @@ class RequiredFieldRule {
         message: '',
       };
     }
-    else if (typeof input === 'string') {
+    else if (typeof input === 'string' || Array.isArray(input)) {
       return {
         isValid: input.length > 0,
         message: input.length <= 0 ? 'This field is required' : '',
@@ -66,6 +75,7 @@ class RequiredFieldRule {
     return (typeof input === 'string' ||
       typeof input === 'number' ||
       typeof input === 'boolean' ||
+      (Array.isArray(input) && input.every(this.checkArrayItemType)) ||
       input === null);
   }
 }

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-2bf8bcb4.js');
-require('./featureFlagController-a3377c0c.js');
+const appGlobals = require('./app-globals-82228833.js');
+require('./featureFlagController-d092ffce.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],"checked":[1028],"disabled":[4],"size":[1]}],[4,"vega-sidenav-group",{"icon":[1],"label":[1]}],[4,"vega-sidenav-link",{"icon":[1],"selected":[1540],"url":[1]}],[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],"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],"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);
   });
 };
 

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

@@ -6,13 +6,13 @@ const index = require('./index-c12bc235.js');
 const component = require('./component-4cd0485c.js');
 const accessibility = require('./accessibility-34d46f85.js');
 const designToken = require('./designToken-ac6a4cf5.js');
-const inputValidator = require('./inputValidator-27df89b1.js');
+const inputValidator = require('./inputValidator-4485dcb4.js');
 const ui$1 = require('./ui-1393500e.js');
 const log = require('./log-7b0974fb.js');
 const array = require('./array-414f6d01.js');
 const ui = require('./ui-2ae913d5.js');
 const typeGuard = require('./typeGuard-7a5746f7.js');
-const featureFlagController = require('./featureFlagController-a3377c0c.js');
+const featureFlagController = require('./featureFlagController-d092ffce.js');
 const misc = require('./misc-649f158c.js');
 const icons = require('./icons-5a6aca4a.js');
 const subject = require('./subject-fdccaa01.js');
@@ -1168,13 +1168,6 @@ const VegaCheckbox = class {
   watchCheckedChange() {
     this.vegaChange.emit(this.checked);
   }
-  connectedCallback() {
-    const name = this.el.getAttribute('name');
-    if (name) {
-      this.name = name;
-      this.el.removeAttribute('name');
-    }
-  }
   componentDidLoad() {
     if (this.labelElement.innerHTML.trim() === '') {
       this.labelElement.classList.add('v-hidden');
@@ -4565,6 +4558,21 @@ const VegaProgressTracker = class {
 };
 VegaProgressTracker.style = vegaProgressTrackerCss;
 
+/**
+ * returns a string that is a random UUID
+ *
+ * @returns {string} random UUID string.
+ */
+/**
+ * It returns true if the object is empty, and false if it's not.
+ *
+ * @param {unknown} object - The object to check if it's empty.
+ * @returns {boolean} A function that takes an object as an argument and returns a boolean.
+ */
+const isObjectEmpty = (object) => {
+  return Object.keys(object).length === 0;
+};
+
 const VegaSidenav = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
@@ -4572,6 +4580,8 @@ const VegaSidenav = class {
     this.openState = 'close';
     /** footnote attached to the side nav footer **/
     this.footnote = '';
+    /** header config used to generate side nav with custom logo and headline **/
+    this.headerConfig = {};
     /** support open by default behavior for all screen sizes and disable collapse for large screen */
     this.openByDefault = 'close';
     /**
@@ -4679,13 +4689,16 @@ const VegaSidenav = class {
     this.initResizeObserver();
   }
   /**
-   * It will hide the sidenav in the mobile terminal when clicking the link in the sidenav.
+   * It will hide the sidenav when clicking the link in the sidenav on mobile terminal default.
+   * If link set showSideBarOnClickLink is true that will don't hide the sidenav..
    * The below method is e2e-test covered in
    * @see{module:vega-sidenav-e2e-vega-click-handler-mobile}
+   * @see{module:vega-sidenav-e2e-vega-click-handler-not-close-sidenav-mobile}
    */
   /* istanbul ignore next */
-  onVegaClickHandler() {
-    if (this.responsiveBehavior.showSideBarClickLink) {
+  onVegaClickHandler(e) {
+    const sidenavLink = e.target;
+    if (!this.responsiveBehavior.showSideBarOnClickLink && !sidenavLink.showSideBarOnClickLink) {
       this.setSideNavOpenStatus('clickClose');
     }
   }
@@ -4728,7 +4741,7 @@ const VegaSidenav = class {
    * @see{module:vega-sidenav-mobile-show-backdrop}
    */
   render() {
-    return component.sanitizeVegaComponent(index.h(index.Host, { class: this.getSidebarCss() }, index.h("div", { class: "vega-sidebar", ref: (el) => (this.sidebar = el) }, index.h("div", { class: "vega-sidebar-content-container", ref: (el) => (this.content = el) }, index.h(index.Fragment, null, this.headerConfig && this.renderSideBarHeader(), this.renderSideBarList(), this.renderSideBarFooter())), index.h("i", { role: 'button', onClick: this.handleClickSidebarIcon, onKeyDown: accessibility.createEnterKeyHandlerToTriggerClick(), class: "vega-handler-icon", tabIndex: 0, "aria-label": 'Handle Sidebar Icon' }))), this.el);
+    return component.sanitizeVegaComponent(index.h(index.Host, { class: this.getSidebarCss() }, index.h("div", { class: "vega-sidebar", ref: (el) => (this.sidebar = el) }, index.h("div", { class: "vega-sidebar-content-container", ref: (el) => (this.content = el) }, index.h(index.Fragment, null, !isObjectEmpty(this.headerConfig) && this.renderSideBarHeader(), this.renderSideBarList(), this.renderSideBarFooter())), index.h("i", { role: 'button', onClick: this.handleClickSidebarIcon, onKeyDown: accessibility.createEnterKeyHandlerToTriggerClick(), class: "vega-handler-icon", tabIndex: 0, "aria-label": 'Handle Sidebar Icon' }))), this.el);
   }
   getSidebarCss() {
     return {
@@ -4852,7 +4865,7 @@ const VegaSidenav = class {
         showSideBar: true,
         showBackdrop: false,
         canBeScrolled: true,
-        showSideBarClickLink: false,
+        showSideBarOnClickLink: true,
       };
     }
     else {
@@ -4860,11 +4873,14 @@ const VegaSidenav = class {
         showSideBar: false,
         showBackdrop: true,
         canBeScrolled: false,
-        showSideBarClickLink: true,
+        showSideBarOnClickLink: false,
       };
     }
   }
   /**
+   * The current div uses a named slot and has a sibling above it, if you skip rendering this whole element by checking a variable,
+   * it will cause the slot's position to move into the sibling.
+   * For specific examples, see the documentation of stencil_slot_bug.md
    * The below method is e2e-test covered in
    * @see{module:vega-sidenav-e2e-with-source-with-child}
    * @see{module:vega-sidenav-e2e-with-source-without-length}
@@ -4872,7 +4888,7 @@ const VegaSidenav = class {
   /* istanbul ignore next */
   renderSideBarList() {
     var _a;
-    return (index.h(index.Fragment, null, index.h("div", { class: { 'v-mt-size-24': !this.headerConfig } }, index.h("slot", { name: "before-list-slot" })), index.h("div", { class: "vega-nav-list", ref: (ref) => (this.list = ref) }, ((_a = this.source) === null || _a === void 0 ? void 0 : _a.length) ? this.renderSideBarListBySource() : index.h("slot", null))));
+    return (index.h(index.Fragment, null, isObjectEmpty(this.headerConfig) ? index.h("div", { class: "v-mt-size-24" }) : null, index.h("slot", { name: "before-list-slot" }), index.h("div", { class: "vega-nav-list", ref: (ref) => (this.list = ref) }, ((_a = this.source) === null || _a === void 0 ? void 0 : _a.length) ? this.renderSideBarListBySource() : index.h("slot", null))));
   }
   /**
    * The below method is e2e-test covered in
@@ -4990,6 +5006,8 @@ const VegaSidenavLink = class {
     this.vegaClick = index.createEvent(this, "vegaClick", 7);
     /** boolean indicating if current link item is selected **/
     this.selected = false;
+    /** boolean indicating if the link close sidenav when click it */
+    this.showSideBarOnClickLink = false;
     /**
      * The below method is e2e-test covered in
      * @see{module:vega-sidenav-link-click-event}

package/dist/cjs/vega-checkbox-group.cjs.entry.js

@@ -3,9 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-c12bc235.js');
-const inputValidator = require('./inputValidator-27df89b1.js');
+const inputValidator = require('./inputValidator-4485dcb4.js');
 const component = require('./component-4cd0485c.js');
 const subject = require('./subject-fdccaa01.js');
+const featureFlagController = require('./featureFlagController-d092ffce.js');
 require('./log-7b0974fb.js');
 
 const VegaCheckboxGroup = class {
@@ -16,7 +17,8 @@ const VegaCheckboxGroup = class {
     /** the label of checkbox group. */
     this.label = '';
     /** array indicating the values of all the nested checkbox **/
-    this.value = '';
+    /** TODO: When FeatureFlag is deleted, the type of value needs to be set to string[]. */
+    this.value = [];
     /** all properties of vega-flex components */
     this.vegaFlexProp = {
       gap: 'size-8',
@@ -37,6 +39,9 @@ const VegaCheckboxGroup = class {
     /** set the validation status. */
     this.isValid = null;
   }
+  watchName() {
+    this.initCheckboxArray();
+  }
   watchVegaFlexProp() {
     this.setVegaFlexProperty();
   }
@@ -47,7 +52,7 @@ const VegaCheckboxGroup = class {
     // Hide the error message UI for the disabled input
     // and show the error message UI for the re-enabled input
     await this.valid();
-    this.setVegaCheckboxDisabled();
+    this.initCheckboxArray();
   }
   /**
    * The below method is e2e-test covered in
@@ -72,10 +77,8 @@ const VegaCheckboxGroup = class {
     this.setupInputValidator();
   }
   componentDidLoad() {
-    this.vegaCheckboxArray = Array.from(this.el.querySelectorAll('vega-checkbox'));
     this.setVegaFlexProperty();
-    this.setVegaCheckboxDisabled();
-    this.syncCheckboxItemsValue();
+    this.initCheckboxArray();
   }
   async changeValue(event) {
     if (event.target !== this.el) {
@@ -138,15 +141,38 @@ const VegaCheckboxGroup = class {
         checkedValue.push(vegaCheckbox.value);
       }
     });
-    this.value = checkedValue.join(',');
+    if (featureFlagController.FeatureFlag.isEnabled('VEGA_CHECK_GROUP.VALUE_PROPERTY_TYPE_CHANGE_ARRAY')) {
+      this.value = checkedValue;
+    }
+    else {
+      this.value = checkedValue.join(',');
+    }
   }
-  setVegaCheckboxDisabled() {
+  initCheckboxArray() {
+    this.defaultValue = this.value;
+    this.vegaCheckboxArray = Array.from(this.el.querySelectorAll('vega-checkbox'));
     this.vegaCheckboxArray.forEach((vegaCheckbox) => {
+      if (this.defaultValue && this.defaultValue.length > 0) {
+        if (featureFlagController.FeatureFlag.isEnabled('VEGA_CHECK_GROUP.VALUE_PROPERTY_TYPE_CHANGE_ARRAY')) {
+          vegaCheckbox.checked = this.defaultValue.includes(vegaCheckbox.value);
+        }
+        else {
+          const valueArray = this.defaultValue.split(',');
+          vegaCheckbox.checked = valueArray.includes(vegaCheckbox.value);
+        }
+      }
       vegaCheckbox.disabled = this.disabled;
+      if (this.name) {
+        vegaCheckbox.name = this.name;
+      }
+      else {
+        vegaCheckbox.name = vegaCheckbox.getAttribute('name');
+      }
     });
   }
   get el() { return index.getElement(this); }
   static get watchers() { return {
+    "name": ["watchName"],
     "vegaFlexProp": ["watchVegaFlexProp"],
     "disabled": ["watchDisabled"],
     "required": ["watchDefaultValidationRule"],

package/dist/cjs/vega-radio-group.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-c12bc235.js');
 const component = require('./component-4cd0485c.js');
-const inputValidator = require('./inputValidator-27df89b1.js');
+const inputValidator = require('./inputValidator-4485dcb4.js');
 require('./log-7b0974fb.js');
 
 const VegaRadioGroup = class {

package/dist/cjs/vega.cjs.js

@@ -1,8 +1,8 @@
 'use strict';
 
 const index = require('./index-c12bc235.js');
-const appGlobals = require('./app-globals-2bf8bcb4.js');
-require('./featureFlagController-a3377c0c.js');
+const appGlobals = require('./app-globals-82228833.js');
+require('./featureFlagController-d092ffce.js');
 
 /*
  Stencil Client Patch Browser v2.17.4 | MIT Licensed | https://stenciljs.com
@@ -18,5 +18,5 @@ const patchBrowser = () => {
 
 patchBrowser().then(options => {
   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],"checked":[1028],"disabled":[4],"size":[1]}],[4,"vega-sidenav-group",{"icon":[1],"label":[1]}],[4,"vega-sidenav-link",{"icon":[1],"selected":[1540],"url":[1]}],[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],"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],"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);
 });

package/dist/collection/components/vega-checkbox/vega-checkbox-group.js

@@ -4,12 +4,14 @@ import { RequiredFieldRule } from '../../helpers/validator/rules/requiredFieldRu
 import { sanitizeVegaComponent } from '../../utils/component';
 import ChangeManager from '../../helpers/observer/changeManager';
 import { FORM_CONTROLLED_FIELD_DISABLED_STATUS_CHANGE } from '../../helpers/observer/subject';
+import { FeatureFlag } from '../../helpers/feature-control/featureFlagController';
 export class VegaCheckboxGroup {
   constructor() {
     /** the label of checkbox group. */
     this.label = '';
     /** array indicating the values of all the nested checkbox **/
-    this.value = '';
+    /** TODO: When FeatureFlag is deleted, the type of value needs to be set to string[]. */
+    this.value = [];
     /** all properties of vega-flex components */
     this.vegaFlexProp = {
       gap: 'size-8',
@@ -30,6 +32,9 @@ export class VegaCheckboxGroup {
     /** set the validation status. */
     this.isValid = null;
   }
+  watchName() {
+    this.initCheckboxArray();
+  }
   watchVegaFlexProp() {
     this.setVegaFlexProperty();
   }
@@ -40,7 +45,7 @@ export class VegaCheckboxGroup {
     // Hide the error message UI for the disabled input
     // and show the error message UI for the re-enabled input
     await this.valid();
-    this.setVegaCheckboxDisabled();
+    this.initCheckboxArray();
   }
   /**
    * The below method is e2e-test covered in
@@ -65,10 +70,8 @@ export class VegaCheckboxGroup {
     this.setupInputValidator();
   }
   componentDidLoad() {
-    this.vegaCheckboxArray = Array.from(this.el.querySelectorAll('vega-checkbox'));
     this.setVegaFlexProperty();
-    this.setVegaCheckboxDisabled();
-    this.syncCheckboxItemsValue();
+    this.initCheckboxArray();
   }
   async changeValue(event) {
     if (event.target !== this.el) {
@@ -141,11 +144,33 @@ export class VegaCheckboxGroup {
         checkedValue.push(vegaCheckbox.value);
       }
     });
-    this.value = checkedValue.join(',');
+    if (FeatureFlag.isEnabled('VEGA_CHECK_GROUP.VALUE_PROPERTY_TYPE_CHANGE_ARRAY')) {
+      this.value = checkedValue;
+    }
+    else {
+      this.value = checkedValue.join(',');
+    }
   }
-  setVegaCheckboxDisabled() {
+  initCheckboxArray() {
+    this.defaultValue = this.value;
+    this.vegaCheckboxArray = Array.from(this.el.querySelectorAll('vega-checkbox'));
     this.vegaCheckboxArray.forEach((vegaCheckbox) => {
+      if (this.defaultValue && this.defaultValue.length > 0) {
+        if (FeatureFlag.isEnabled('VEGA_CHECK_GROUP.VALUE_PROPERTY_TYPE_CHANGE_ARRAY')) {
+          vegaCheckbox.checked = this.defaultValue.includes(vegaCheckbox.value);
+        }
+        else {
+          const valueArray = this.defaultValue.split(',');
+          vegaCheckbox.checked = valueArray.includes(vegaCheckbox.value);
+        }
+      }
       vegaCheckbox.disabled = this.disabled;
+      if (this.name) {
+        vegaCheckbox.name = this.name;
+      }
+      else {
+        vegaCheckbox.name = vegaCheckbox.getAttribute('name');
+      }
     });
   }
   static get is() { return "vega-checkbox-group"; }
@@ -172,19 +197,36 @@ export class VegaCheckboxGroup {
       "type": "string",
       "mutable": true,
       "complexType": {
-        "original": "string",
-        "resolved": "string",
+        "original": "string[] | string",
+        "resolved": "string | string[]",
         "references": {}
       },
       "required": false,
       "optional": false,
       "docs": {
         "tags": [],
-        "text": "array indicating the values of all the nested checkbox *"
+        "text": "TODO: When FeatureFlag is deleted, the type of value needs to be set to string[]."
       },
       "attribute": "value",
       "reflect": false,
-      "defaultValue": "''"
+      "defaultValue": "[]"
+    },
+    "name": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The name of the input in each checkbox"
+      },
+      "attribute": "name",
+      "reflect": false
     },
     "vegaFlexProp": {
       "type": "unknown",
@@ -309,11 +351,11 @@ export class VegaCheckboxGroup {
       "composed": true,
       "docs": {
         "tags": [],
-        "text": "event emitter used for notifying consumers any of checkbox value change event"
+        "text": "TODO: When FeatureFlag is deleted, the type of EventEmitter needs to be set to string[]."
       },
       "complexType": {
-        "original": "string",
-        "resolved": "string",
+        "original": "string[] | string",
+        "resolved": "string | string[]",
         "references": {}
       }
     }, {
@@ -358,6 +400,9 @@ export class VegaCheckboxGroup {
   }; }
   static get elementRef() { return "el"; }
   static get watchers() { return [{
+      "propName": "name",
+      "methodName": "watchName"
+    }, {
       "propName": "vegaFlexProp",
       "methodName": "watchVegaFlexProp"
     }, {

package/dist/collection/components/vega-checkbox/vega-checkbox.js

@@ -23,13 +23,6 @@ export class VegaCheckbox {
   watchCheckedChange() {
     this.vegaChange.emit(this.checked);
   }
-  connectedCallback() {
-    const name = this.el.getAttribute('name');
-    if (name) {
-      this.name = name;
-      this.el.removeAttribute('name');
-    }
-  }
   componentDidLoad() {
     if (this.labelElement.innerHTML.trim() === '') {
       this.labelElement.classList.add('v-hidden');
@@ -65,6 +58,23 @@ export class VegaCheckbox {
       "attribute": "value",
       "reflect": false
     },
+    "name": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "the current checkbox input name *"
+      },
+      "attribute": "name",
+      "reflect": false
+    },
     "checked": {
       "type": "boolean",
       "mutable": true,