@globalpayments/vega 2.21.0 → 2.22.0

package/dist/collection/components/vega-selection-chip/vega-selection-chip.css

@@ -0,0 +1,175 @@
+/* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */ /* This file is generated by vega-design 2.0.77 */
+/**
+ * Deprecated. Not for use in new websites.
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/word-break#break-word
+ */
+:host(.block) {
+  display: block;
+}
+:host(.block) vega-tooltip {
+  display: block;
+}
+
+:host {
+  max-width: 100%;
+  display: inline-block;
+  vertical-align: middle;
+  line-height: 0;
+}
+:host vega-tooltip {
+  max-width: 100%;
+}
+:host .swatch {
+  margin: 2px;
+  padding: 1px;
+  box-sizing: border-box;
+}
+:host .swatch vega-box {
+  width: 100%;
+  height: 100%;
+}
+:host .label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+:host .vega-selection-chip {
+  background-color: rgba(var(--v-bg-tile, 252, 252, 252, 1));
+  cursor: pointer;
+  margin: 1px;
+}
+:host .variant-text .label {
+  text-align: center;
+}
+:host .size-extra-small.variant-swatch.vega-selection-chip {
+  padding-top: 2px;
+  padding-bottom: 2px;
+  padding-left: 2px;
+  padding-right: 12px;
+}
+:host .size-extra-small.variant-text.vega-selection-chip {
+  padding-left: 12px;
+  padding-right: 12px;
+  padding-top: 2px;
+  padding-bottom: 2px;
+}
+:host .size-extra-small vega-flex {
+  height: 16px;
+}
+:host .size-extra-small .swatch {
+  width: 12px;
+  height: 12px;
+}
+:host .size-small.variant-swatch.vega-selection-chip {
+  padding-top: 4px;
+  padding-bottom: 4px;
+  padding-left: 4px;
+  padding-right: 12px;
+}
+:host .size-small.variant-text.vega-selection-chip {
+  padding-left: 12px;
+  padding-right: 12px;
+  padding-top: 4px;
+  padding-bottom: 4px;
+}
+:host .size-small vega-flex {
+  height: 24px;
+}
+:host .size-small .swatch {
+  width: 20px;
+  height: 20px;
+}
+:host .size-medium.variant-swatch.vega-selection-chip {
+  padding-top: 4px;
+  padding-bottom: 4px;
+  padding-left: 4px;
+  padding-right: 16px;
+}
+:host .size-medium.variant-text.vega-selection-chip {
+  padding-left: 16px;
+  padding-right: 16px;
+  padding-top: 4px;
+  padding-bottom: 4px;
+}
+:host .size-medium vega-flex {
+  height: 32px;
+}
+:host .size-medium .swatch {
+  width: 28px;
+  height: 28px;
+}
+:host .size-large.variant-swatch.vega-selection-chip {
+  padding-top: 4px;
+  padding-bottom: 4px;
+  padding-left: 4px;
+  padding-right: 20px;
+}
+:host .size-large.variant-text.vega-selection-chip {
+  padding-left: 20px;
+  padding-right: 20px;
+  padding-top: 4px;
+  padding-bottom: 4px;
+}
+:host .size-large vega-flex {
+  height: 40px;
+}
+:host .size-large .swatch {
+  width: 36px;
+  height: 36px;
+}
+:host .vega-selection-chip:not(.disabled) {
+  background-color: rgba(var(--v-bg-tile, 252, 252, 252, 1));
+  border: 1px solid rgba(var(--v-border-tile, 171, 198, 216, 1));
+}
+:host .vega-selection-chip:not(.disabled):hover {
+  background-color: rgba(var(--v-bg-tile-hover, 245, 247, 247, 1));
+  border: 1px solid rgba(var(--v-border-tile-hover, 115, 160, 190, 1));
+}
+:host .vega-selection-chip:not(.disabled):focus-visible {
+  background-color: rgba(var(--v-bg-tile, 252, 252, 252, 1));
+  outline: 2px solid rgba(var(--v-border-color-action, 19, 98, 226, 1));
+  outline-offset: 2px;
+  border: 1px solid rgba(var(--v-border-tile-focus, 19, 98, 226, 1));
+}
+:host .vega-selection-chip:not(.disabled).checked {
+  background-color: rgba(var(--v-bg-tile-selected, 242, 247, 255, 1));
+  border: 2px solid rgba(var(--v-border-tile-selected, 19, 98, 226, 1));
+  margin: 0px;
+}
+:host .vega-selection-chip:not(.disabled).checked:hover {
+  background-color: rgba(var(--v-bg-tile-selected-hover, 229, 239, 255, 1));
+  border: 2px solid rgba(var(--v-border-tile-selected-hover, 4, 112, 236, 1));
+}
+:host .vega-selection-chip:not(.disabled).checked:focus-visible {
+  background-color: rgba(var(--v-bg-tile-selected, 242, 247, 255, 1));
+  border: 2px solid rgba(var(--v-border-tile-selected-focus, 19, 98, 226, 1));
+}
+:host .vega-selection-chip:not(.disabled).error {
+  background-color: rgba(var(--v-bg-tile, 252, 252, 252, 1));
+  border: 1px solid rgba(var(--v-border-input-field-danger, 230, 50, 87, 1));
+}
+:host .vega-selection-chip:not(.disabled).error:hover {
+  background-color: rgba(var(--v-bg-tile-hover, 245, 247, 247, 1));
+  border: 1px solid rgba(var(--v-border-input-field-danger-hover, 255, 87, 114, 1));
+}
+:host .vega-selection-chip:not(.disabled).error:focus-visible {
+  background-color: rgba(var(--v-bg-tile, 252, 252, 252, 1));
+  outline: 2px solid rgba(var(--v-border-color-danger, 230, 50, 87, 1));
+  outline-offset: 2px;
+  border: 1px solid rgba(var(--v-border-input-field-danger-focus, 233, 71, 104, 1));
+}
+:host .vega-selection-chip.disabled {
+  background-color: rgba(var(--v-bg-tile, 252, 252, 252, 1));
+  border: 1px solid rgba(var(--v-border-input-field-disabled, 222, 225, 227, 1));
+  pointer-events: none;
+  color: rgba(var(--v-text-disabled, 176, 180, 181, 1));
+}
+:host .vega-selection-chip.disabled:focus-visible {
+  outline: none;
+}
+:host .vega-selection-chip.disabled vega-font {
+  color: rgba(var(--v-text-disabled, 176, 180, 181, 1));
+}
+:host .vega-selection-chip.disabled .swatch {
+  opacity: 0.5;
+}

package/dist/collection/components/vega-selection-chip/vega-selection-chip.js

@@ -0,0 +1,335 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Component, Prop, Element, Event, State, Watch } from '@stencil/core';
+import { sanitizeVegaComponent } from '../../utils/component';
+import { InjectVegaGlobalSlimmer, InjectVegaSlimmer, methodPlaceholder, } from 'vega-slimmer/core';
+import { VegaSelectionChipRenderer } from './slimmers/renderers/vega-selection-chip-renderer';
+import { VegaSelectionChipCheckedController } from './slimmers/controllers/vega-selection-chip-checked-cotroller';
+import { VegaSelectionChipStateController } from './slimmers/controllers/vega-selection-chip-state-controller';
+import { VegaSelectionChipShowErrorController } from './slimmers/controllers/vega-selection-chip-show-error-controller';
+import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/component-usage-runtime-metrics';
+import { PageResizeObserverSlimmer } from '../../helpers/slimmers/page-resize-observer-slimmer';
+import { getCurrentBreakpoint } from '../../utils/breakpoints';
+import { VegaChange } from '../../helpers/event-manager/event-id/vega-event-id';
+import { createEventEmitSlimmer, } from '../../helpers/event-manager/slimmers/event-emit-slimmer';
+export class VegaSelectionChip {
+  constructor() {
+    this.globalSlimmers = {};
+    this.renderer = new VegaSelectionChipRenderer();
+    this.checkedController = new VegaSelectionChipCheckedController();
+    this.stateController = new VegaSelectionChipStateController();
+    this.showErrorController = new VegaSelectionChipShowErrorController();
+    this.pageResizeObserverSlimmer = new PageResizeObserverSlimmer();
+    this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
+    this.changeEventEmitter = createEventEmitSlimmer(VegaSelectionChip, VegaChange);
+    /**
+     * Indicates whether the parent selection chip group shows error message.
+     */
+    this.showError = false;
+    this.currentBreakpoint = getCurrentBreakpoint();
+    /**
+     * Specifies the label or title for the selection chip.
+     * It provides descriptive text that helps identify
+     *    the purpose of the selection chip.
+     */
+    this.label = '';
+    /**
+     * Specifies the size of the selection chip.
+     */
+    this.size = 'medium';
+    /**
+     * Determines the rendering style for the selection chip.
+     */
+    this.variant = 'text';
+    /**
+     * Indicates if the selection chip is disabled.
+     */
+    /* eslint-disable @stencil/strict-mutable */
+    this.disabled = false;
+    /**
+     * Defines the display behavior of the selection chip.
+     * This property controls how the chip is presented
+     *    in relation to surrounding elements.
+     */
+    this.block = false;
+    /**
+     * Defines the background color of the swatch.
+     * It accepts a string value representing a valid
+     *    background color token,
+     *    which customizes the chip appearance.
+     */
+    this.swatchColor = 'bg-status-info';
+  }
+  watchSize() {
+    methodPlaceholder();
+  }
+  componentWillRender() {
+    methodPlaceholder();
+  }
+  render() {
+    return sanitizeVegaComponent(this.renderer.render(), this.host);
+  }
+  static get is() { return "vega-selection-chip"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["vega-selection-chip.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["vega-selection-chip.css"]
+  }; }
+  static get properties() { return {
+    "label": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Specifies the label or title for the selection chip.\nIt provides descriptive text that helps identify\n   the purpose of the selection chip."
+      },
+      "attribute": "label",
+      "reflect": false,
+      "defaultValue": "''"
+    },
+    "size": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "ResponsiveType<VegaSelectionChipSize>",
+        "resolved": "\"extra-small\" | \"large\" | \"medium\" | \"small\" | { S?: VegaSelectionChipSize; M?: VegaSelectionChipSize; L?: VegaSelectionChipSize; XL?: VegaSelectionChipSize; default?: VegaSelectionChipSize; }",
+        "references": {
+          "ResponsiveType": {
+            "location": "import",
+            "path": "../../types/ui.type"
+          },
+          "VegaSelectionChipSize": {
+            "location": "import",
+            "path": "./interface"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Specifies the size of the selection chip."
+      },
+      "attribute": "size",
+      "reflect": false,
+      "defaultValue": "'medium'"
+    },
+    "variant": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "VegaSelectionChipVariant",
+        "resolved": "\"swatch\" | \"text\"",
+        "references": {
+          "VegaSelectionChipVariant": {
+            "location": "import",
+            "path": "./interface"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Determines the rendering style for the selection chip."
+      },
+      "attribute": "variant",
+      "reflect": false,
+      "defaultValue": "'text'"
+    },
+    "disabled": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Indicates if the selection chip is disabled."
+      },
+      "attribute": "disabled",
+      "reflect": false,
+      "defaultValue": "false"
+    },
+    "checked": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Determines if the selection chip is checked."
+      },
+      "attribute": "checked",
+      "reflect": true
+    },
+    "block": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Defines the display behavior of the selection chip.\nThis property controls how the chip is presented\n   in relation to surrounding elements."
+      },
+      "attribute": "block",
+      "reflect": false,
+      "defaultValue": "false"
+    },
+    "disabledTooltip": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "VegaSelectionChipTooltipProps",
+        "resolved": "{ alignment?: ElementAppenderAlignmentType; maxWidth?: ResponsiveType<SizeType>; minWidth?: ResponsiveType<SizeType>; placement?: ElementAppenderPlacementType; positionRelativeTo?: string; size?: ResponsiveType<SizeType>; trigger?: \"click\" | \"hover\" | \"none\"; content?: string; disableInteractive?: boolean; text?: string; }",
+        "references": {
+          "VegaSelectionChipTooltipProps": {
+            "location": "import",
+            "path": "./interface"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Specifies the tooltip displayed for the selection chip\n   when it is in a disabled state.\nThis provides additional context or information about the chip's\n   functionality or reason for being disabled."
+      }
+    },
+    "swatchColor": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "BackgroundColorsTokenType",
+        "resolved": "\"bg-brand\" | \"bg-page\" | \"bg-primary\" | \"bg-secondary\" | \"bg-tertiary\" | \"bg-quaternary\" | \"bg-inverted-primary\" | \"bg-inverted-secondary\" | \"bg-inverted-tertiary\" | \"bg-inverted-quaternary\" | \"bg-action\" | \"bg-action-hover\" | \"bg-action-focus\" | \"bg-action-active\" | \"bg-action-quaternary\" | \"bg-action-quaternary-hover\" | \"bg-action-quaternary-active\" | \"bg-action-secondary\" | \"bg-action-secondary-hover\" | \"bg-action-secondary-active\" | \"bg-action-tertiary\" | \"bg-action-tertiary-hover\" | \"bg-action-tertiary-active\" | \"bg-app-header\" | \"bg-backdrop-modal\" | \"bg-backdrop-popover\" | \"bg-backdrop-sidebar\" | \"bg-chip\" | \"bg-chip-hover\" | \"bg-chip-active\" | \"bg-danger\" | \"bg-danger-hover\" | \"bg-danger-focus\" | \"bg-danger-active\" | \"bg-danger-tertiary\" | \"bg-danger-tertiary-hover\" | \"bg-danger-tertiary-active\" | \"bg-disabled\" | \"bg-divider\" | \"bg-divider-secondary\" | \"bg-keypad-btn-active\" | \"bg-loading-progress\" | \"bg-loading-track\" | \"bg-segment-hover\" | \"bg-segment-control\" | \"bg-selected\" | \"bg-sidebar\" | \"bg-sidebar-icon\" | \"bg-sidebar-icon-hover\" | \"bg-sidebar-icon-selected\" | \"bg-sidebar-item-hover\" | \"bg-sidebar-item-selected\" | \"bg-site-footer\" | \"bg-site-footer-action\" | \"bg-site-footer-action-hover\" | \"bg-site-footer-action-active\" | \"bg-site-footer-field\" | \"bg-slider-handle\" | \"bg-status-error\" | \"bg-status-info\" | \"bg-status-success\" | \"bg-status-warning\" | \"bg-tab\" | \"bg-tab-hover\" | \"bg-tab-selected\" | \"bg-table-alt-row\" | \"bg-table-header\" | \"bg-table-row-hover\" | \"bg-table-row-selected-expanded\" | \"bg-table-selected-row\" | \"bg-textarea-count\" | \"bg-tile\" | \"bg-tile-hover\" | \"bg-tile-selected\" | \"bg-tile-selected-hover\" | \"bg-toggle-switch\" | \"bg-toggle-switch-hover\" | \"bg-toggle-switch-selected-disabled\" | \"bg-transparent\" | \"bg-accent1-primary\" | \"bg-accent1-secondary\" | \"bg-accent1-tertiary\" | \"bg-accent2-primary\" | \"bg-accent2-secondary\" | \"bg-accent2-tertiary\" | \"bg-accent3-primary\" | \"bg-accent3-secondary\" | \"bg-accent3-tertiary\" | \"bg-accent4-primary\" | \"bg-accent4-secondary\" | \"bg-accent4-tertiary\" | \"bg-accent5-primary\" | \"bg-accent5-secondary\" | \"bg-accent5-tertiary\" | \"bg-accent6-primary\" | \"bg-accent6-secondary\" | \"bg-accent6-tertiary\" | \"bg-accent7-primary\" | \"bg-accent7-secondary\" | \"bg-accent7-tertiary\" | \"bg-accent8-primary\" | \"bg-accent8-secondary\" | \"bg-accent8-tertiary\" | \"bg-accent9-primary\" | \"bg-accent9-secondary\" | \"bg-accent9-tertiary\" | \"bg-accent10-primary\" | \"bg-accent10-secondary\" | \"bg-accent10-tertiary\" | \"bg-date-picker-range\"",
+        "references": {
+          "BackgroundColorsTokenType": {
+            "location": "import",
+            "path": "../../types/design-token.type"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Defines the background color of the swatch.\nIt accepts a string value representing a valid\n   background color token,\n   which customizes the chip appearance."
+      },
+      "attribute": "swatch-color",
+      "reflect": false,
+      "defaultValue": "'bg-status-info'"
+    },
+    "value": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": true,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Stores the value associated with the selection chip\n   when it is checked or unchecked."
+      },
+      "attribute": "value",
+      "reflect": false
+    }
+  }; }
+  static get states() { return {
+    "showError": {},
+    "currentBreakpoint": {},
+    "selectType": {}
+  }; }
+  static get events() { return [{
+      "method": "vegaChange",
+      "name": "vegaChange",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": "An event emitter notifying changes in the value of the selection chip,\n   whether triggered programmatically or through user interaction."
+      },
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      }
+    }, {
+      "method": "change",
+      "name": "change",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [{
+            "name": "eventSemantics",
+            "text": "namespace:native"
+          }],
+        "text": "An event emitter notifying changes in the value of the selection chip,\n   whether triggered programmatically or through user interaction."
+      },
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      }
+    }]; }
+  static get elementRef() { return "host"; }
+  static get watchers() { return [{
+      "propName": "size",
+      "methodName": "watchSize"
+    }]; }
+}
+__decorate([
+  InjectVegaGlobalSlimmer()
+], VegaSelectionChip.prototype, "globalSlimmers", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaSelectionChip.prototype, "renderer", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaSelectionChip.prototype, "checkedController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaSelectionChip.prototype, "stateController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaSelectionChip.prototype, "showErrorController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaSelectionChip.prototype, "pageResizeObserverSlimmer", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaSelectionChip.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaSelectionChip.prototype, "changeEventEmitter", void 0);

package/dist/collection/components/vega-table/slimmers/controllers/vega-table-sort-controller.js

@@ -24,6 +24,9 @@ export class VegaTableSortController extends VegaSlimmer {
    * @param {VegaTableSortOrderType} nextSortOrder - The next sorter order
    */
   handleHeadSortClick(column, nextSortOrder) {
+    if (this.sortConfig.type === 'single') {
+      this.sortersMap.clear();
+    }
     if (!nextSortOrder) {
       if (this.sortersMap.has(column.prop)) {
         this.sortersMap.delete(column.prop);
@@ -80,6 +83,9 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaTableSortController.prototype, "vegaTableDataSourceController", void 0);
+__decorate([
+  MapToComponentField()
+], VegaTableSortController.prototype, "sortConfig", void 0);
 __decorate([
   MapToComponentMethod('watchColumns')
 ], VegaTableSortController.prototype, "watchColumns", null);

package/dist/collection/components/vega-table/slimmers/controllers/vega-table-sorter.js

@@ -30,4 +30,12 @@ export class VegaTableSorter {
   toExternalFormat() {
     return { prop: this.prop, order: this.order };
   }
+  /**
+   * Get sorter order value
+   *
+   * @returns {{VegaTableSortOrderType}} sorter order
+   */
+  getSortOrder() {
+    return this.order;
+  }
 }

package/dist/collection/components/vega-table/slimmers/renderers/vega-table-header-renderer.js

@@ -13,7 +13,8 @@ export class VegaTableHeaderRenderer extends VegaSlimmer {
     super(...arguments);
     this.renderHeaderColumnCells = () => {
       return this.columns.map((column) => {
-        return (h("vega-table-head-cell", { key: column.key || column.prop, textAlign: column.align, sorter: column.sorter, sortOrder: column.sortOrder, breakpoint: column.breakpoint, 
+        var _a;
+        return (h("vega-table-head-cell", { key: column.key || column.prop, textAlign: column.align, sorter: column.sorter, sortOrder: (_a = this.sortersMap.get(column.prop)) === null || _a === void 0 ? void 0 : _a.getSortOrder(), breakpoint: column.breakpoint, 
           /* eslint-disable-next-line react/jsx-no-bind */
           ref: (ref) => {
             DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaClick, (input) => {
@@ -33,6 +34,9 @@ export class VegaTableHeaderRenderer extends VegaSlimmer {
 __decorate([
   MapToComponentField()
 ], VegaTableHeaderRenderer.prototype, "showHeader", void 0);
+__decorate([
+  MapToComponentField()
+], VegaTableHeaderRenderer.prototype, "sortersMap", void 0);
 __decorate([
   MapToComponentField()
 ], VegaTableHeaderRenderer.prototype, "columns", void 0);

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

@@ -168,6 +168,12 @@ export class VegaTable {
      * Defines a unique key for each row in the table.
      */
     this.rowKey = 'key';
+    /**
+     * Defines the column sorting options
+     * Has optional property type: single | multiple
+     * If not specified, it defaults to multiple column sorting
+     */
+    this.sortConfig = { type: 'multiple' };
   }
   watchSelectedRowKeySet() {
     methodPlaceholder();
@@ -701,6 +707,27 @@ export class VegaTable {
         "tags": [],
         "text": "Customizes the behavior and appearance of the\n   scrollable container that wraps the table."
       }
+    },
+    "sortConfig": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "VegaTableSortConfig",
+        "resolved": "{ type: \"single\" | \"multiple\"; }",
+        "references": {
+          "VegaTableSortConfig": {
+            "location": "import",
+            "path": "./interface"
+          }
+        }
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": "Defines the column sorting options\nHas optional property type: single | multiple\nIf not specified, it defaults to multiple column sorting"
+      },
+      "defaultValue": "{ type: 'multiple' }"
     }
   }; }
   static get states() { return {

package/dist/collection/helpers/event-manager/event-id/component-event-id-map.js

@@ -41,6 +41,8 @@ const entries = [
   ['vega-radio', [VegaChange, VegaFocus, VegaBlur]],
   ['vega-radio-group', [VegaChange]],
   ['vega-segment-control', [VegaChange]],
+  ['vega-selection-chip', [VegaChange]],
+  ['vega-selection-chip-group', [VegaChange]],
   ['vega-selection-tile', [VegaChange]],
   ['vega-selection-tile-group', [VegaChange]],
   ['vega-signature-capture', [VegaChange]],

package/dist/collection/helpers/slimmers/mutation-observer/mutation-observer-filters.js

@@ -37,3 +37,15 @@ export const AttributeOldValueMutationFilter = () => {
     return (mutations.find((mutation) => mutation.attributeName && mutation.oldValue !== host.getAttribute(mutation.attributeName)) !== undefined);
   };
 };
+/**
+ * Filters mutations based on specified tag names or attribute changes.
+ *
+ * @param {string[]} tagNames - The tagName of need listened child.
+ * @returns {Function} - Filter function.
+ */
+export const TagNameAndAttributeMutationFilter = (...tagNames) => {
+  return (mutations) => {
+    return (TagNameMutationFilter(...tagNames)(mutations) ||
+      mutations.find((mutation) => mutation.attributeName && tagNames.includes(mutation.target.tagName)) !== undefined);
+  };
+};

package/dist/collection/helpers/slimmers/mutation-observer/mutation-observer-slimmer.js

@@ -51,7 +51,7 @@ export class MutationObserverSlimmer extends VegaSlimmer {
     this.mutationObserver = new MutationObserver(async (mutations) => {
       if (!this.observerEntry.mutationFilter ||
         this.observerEntry.mutationFilter(mutations, this.host)) {
-        this.observerEntry.callback();
+        this.observerEntry.callback(mutations);
       }
     });
   }