@globalpayments/vega 2.100.0 → 2.101.0

package/dist/collection/components/vega-calendar/slimmers/common/renderers/vega-calendar-event-item-renderer.js

@@ -11,8 +11,16 @@ import { getCalendarEventSlotName } from '../../../utils';
 import ChangeManager from '../../../../../helpers/change-manager/change-manager';
 import DomNodeSubjectFactory from '../../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
 import { VegaInternalCalendarEventPreviewUpdate } from '../../../../../helpers/event-manager/event-id/vega-internal-event-id';
+import { findParent } from '../../../../../utils/ui';
 /** The `VegaCalendarEventItemRenderer` class in TypeScript React is used for rendering calendar event items with specific layout and styling properties. */
 export class VegaCalendarEventItemRenderer extends VegaSlimmer {
+  /**
+   * While it is a single event and the trigger is hover, we should show the preview popover when mouse enter on the event item.
+   */
+  previewingEvent(event, targetCalendarViewDate, isGroupEvent) {
+    this.eventPreviewEmitter.emit({ rawEvent: event.event });
+    this.setupPreviewContainer(event, targetCalendarViewDate, isGroupEvent);
+  }
   /**
    * render event component
    *
@@ -24,11 +32,18 @@ export class VegaCalendarEventItemRenderer extends VegaSlimmer {
   render(item, classMap, targetCalendarViewDate, isGroupEvent = false) {
     return (h("vega-calendar-event", { "data-calendar-ref": this.host, key: `${item.eventKey}-${item.startTime.toString()}-${item.endTime.toString()}`, calendarEvent: item, class: classMap, onKeyDown: createEnterKeyHandlerToTriggerClick(), 
       // eslint-disable-next-line react/jsx-no-bind
-      onClick: () => {
-        this.handleEventClick(item);
-        this.enabledEventPreview &&
-          this.setupPreviewContainer(item, targetCalendarViewDate, isGroupEvent);
-      } }, !item.isRepeatEvent && h("slot", { name: getCalendarEventSlotName(item.event.key) })));
+      onClick: () => this.onEventClick(item, targetCalendarViewDate, isGroupEvent) }, !item.isRepeatEvent && h("slot", { name: getCalendarEventSlotName(item.event.key) })));
+  }
+  /**
+   * While it is a group event or the trigger is click with single event, we should show the preview popover when click on the event item.
+   */
+  onEventClick(event, targetCalendarViewDate, isGroupEvent) {
+    var _a;
+    this.handleEventClick(event);
+    if (this.enabledEventPreview &&
+      (isGroupEvent || ((_a = this.eventPreviewPopoverProps) === null || _a === void 0 ? void 0 : _a.trigger) !== 'hover')) {
+      this.previewingEvent(event, targetCalendarViewDate, isGroupEvent);
+    }
   }
   /**
    * emit vega click event
@@ -42,6 +57,7 @@ export class VegaCalendarEventItemRenderer extends VegaSlimmer {
     const previewContainer = this.eventPreviewPopoverController.getEventPreviewContainer(event, targetCalendarViewDate, isGroupEvent);
     if (previewContainer) {
       const preview = this.renderer.getEventPreviewRef();
+      this.hidePreviousPreviewPopover(previewContainer);
       if (isGroupEvent) {
         preview.classList.remove('single-event-preview');
         preview.classList.add('group-event-preview');
@@ -73,6 +89,24 @@ export class VegaCalendarEventItemRenderer extends VegaSlimmer {
       previewContainer.append(preview);
     }
   }
+  /**
+   * 1. The popover is not closed immediately when mouse leave.
+   * 2. The event preview popover shares a single preview component.
+   * While a new event item is hovered, it will make previous event popover empty, this will emit the popover flash in view.
+   * To avoid this, we hide the previous preview popover when a new event item is hovered.
+   * Ticket: https://gethired.atlassian.net/browse/VD-9920
+   */
+  hidePreviousPreviewPopover(previewContainer) {
+    var _a;
+    const preview = this.renderer.getEventPreviewRef();
+    const previousPreviewContainer = preview.parentElement;
+    if (((_a = this.eventPreviewPopoverProps) === null || _a === void 0 ? void 0 : _a.trigger) === 'hover' &&
+      previousPreviewContainer &&
+      previousPreviewContainer !== previewContainer) {
+      const box = findParent(previewContainer, 'vega-popover-content-box');
+      box && box.classList.add('vega-force-hidden');
+    }
+  }
 }
 VegaCalendarEventItemRenderer.backgroundColorModeEventHeight = 18;
 __decorate([
@@ -90,9 +124,15 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "enabledEventPreview", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCalendarEventItemRenderer.prototype, "eventPreviewEmitter", void 0);
 __decorate([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "renderer", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCalendarEventItemRenderer.prototype, "eventPreviewPopoverProps", void 0);
 __decorate([
   MapToComponentField()
 ], VegaCalendarEventItemRenderer.prototype, "eventPreviewPopoverController", void 0);

package/dist/collection/components/vega-calendar/slimmers/common/renderers/vega-calendar-event-preview-popover-renderer.js

@@ -14,6 +14,7 @@ export class VegaCalendarEventPreviewPopoverRenderer extends VegaSlimmer {
   constructor() {
     super(...arguments);
     this.popoverHideObserver = null;
+    this.popoverRefMap = new WeakMap();
   }
   render(event, targetCalendarViewDate, classMap) {
     return this.enabledEventPreview
@@ -21,11 +22,13 @@ export class VegaCalendarEventPreviewPopoverRenderer extends VegaSlimmer {
       : this.eventItemRenderer.render(event, classMap, targetCalendarViewDate);
   }
   renderPreviewPopover(event, classMap, targetCalendarViewDate) {
+    var _a;
     return (h("vega-popover", { isScreenPosition: true, placement: this.viewMode === 'day' ? 'top' : 'right', alignment: "center", class: {
         'event-preview-popover': true,
         'block': true,
-      }, padding: "0", size: VegaCalendarEventPreviewPopoverRenderer.SINGLE_EVENT_PREVIEW_WIDTH, ref: (el) => {
+      }, padding: "0", size: VegaCalendarEventPreviewPopoverRenderer.SINGLE_EVENT_PREVIEW_WIDTH, trigger: ((_a = this.eventPreviewPopoverProps) === null || _a === void 0 ? void 0 : _a.trigger) || 'click', ref: (el) => {
         this.setPopoverHideObserver(el);
+        this.listenPopoverRef(event, el, targetCalendarViewDate);
       } },
       h("div", { slot: "popover-content", class: "event-preview-popover-content" }, this.eventItemRenderer.render(event, classMap, targetCalendarViewDate)),
       h("div", { slot: "popover" },
@@ -44,6 +47,39 @@ export class VegaCalendarEventPreviewPopoverRenderer extends VegaSlimmer {
       ChangeManager.unregister(DomNodeSubjectFactory.getSubject(this.host, VegaInternalCalendarEventPreviewHide), this.popoverHideObserver);
     }
   }
+  listenPopoverRef(item, popover, targetCalendarViewDate) {
+    const onPopoverMouseEnter = (e) => {
+      this.onPopoverMouseEnter(e, item, targetCalendarViewDate);
+    };
+    if (popover) {
+      this.popoverRefMap.set(item, popover);
+      popover.removeEventListener('mouseenter', onPopoverMouseEnter);
+      popover.addEventListener('mouseenter', onPopoverMouseEnter);
+    }
+    else if (this.popoverRefMap.has(item)) {
+      const popoverRef = this.popoverRefMap.get(item);
+      if (popoverRef) {
+        popoverRef.removeEventListener('mouseenter', onPopoverMouseEnter);
+        this.popoverRefMap.delete(item);
+      }
+    }
+  }
+  /**
+   * When the mouse enters the popover, if the trigger is hover, we should show the preview popover when mouse enter on the event item.
+   * If the group event is previewing, we should prevent the popover from showing.
+   */
+  onPopoverMouseEnter(event, eventItem, targetCalendarViewDate) {
+    var _a;
+    if (this.enabledEventPreview && ((_a = this.eventPreviewPopoverProps) === null || _a === void 0 ? void 0 : _a.trigger) === 'hover') {
+      if (this.monthEventRenderer.isGroupEventPreviewing()) {
+        event.preventDefault();
+        event.stopImmediatePropagation();
+      }
+      else {
+        this.eventItemRenderer.previewingEvent(eventItem, targetCalendarViewDate, false);
+      }
+    }
+  }
 }
 VegaCalendarEventPreviewPopoverRenderer.SINGLE_EVENT_PREVIEW_WIDTH = 400;
 __decorate([
@@ -64,6 +100,12 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "enabledEventPreview", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCalendarEventPreviewPopoverRenderer.prototype, "eventPreviewPopoverProps", void 0);
 __decorate([
   MapToComponentField()
 ], VegaCalendarEventPreviewPopoverRenderer.prototype, "eventPreviewPopoverController", void 0);
+__decorate([
+  MapToComponentField()
+], VegaCalendarEventPreviewPopoverRenderer.prototype, "monthEventRenderer", void 0);

package/dist/collection/components/vega-calendar/slimmers/month-view/renderers/vega-calendar-month-event-renderer.js

@@ -11,7 +11,7 @@ import { VegaInternalCalendarEventPreviewClear, VegaInternalCalendarEventPreview
 import { createEnterKeyHandlerToTriggerClick } from '../../../../../utils/accessibility';
 import { Observer } from '../../../../../helpers/change-manager/observer/observer';
 import ChangeManager from '../../../../../helpers/change-manager/change-manager';
-import { VegaPopoverHide } from '../../../../../helpers/event-manager/event-id/vega-event-id';
+import { VegaPopoverHide, VegaPopoverShow, } from '../../../../../helpers/event-manager/event-id/vega-event-id';
 import DomNodeSubjectFactory from '../../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
 /** This code snippet defines a TypeScript class `VegaCalendarMonthEventRenderer` that extends `VegaSlimmer`. Here's a breakdown of what the class and its methods are doing: */
 export class VegaCalendarMonthEventRenderer extends VegaSlimmer {
@@ -19,6 +19,7 @@ export class VegaCalendarMonthEventRenderer extends VegaSlimmer {
     super(...arguments);
     this.maxMonthDisplayEventsCount = 2;
     this.popoverHideObserver = null;
+    this.isGroupEventPreviewingFlag = false;
   }
   /**
    * current row dates all events.
@@ -67,6 +68,14 @@ export class VegaCalendarMonthEventRenderer extends VegaSlimmer {
   getMoreEventsBoxRef() {
     return this.moreEventsBoxRef;
   }
+  /**
+   * Check if a group event preview is currently being displayed
+   *
+   * @returns {boolean} - True if a group event preview is being displayed, false otherwise
+   */
+  isGroupEventPreviewing() {
+    return this.isGroupEventPreviewingFlag;
+  }
   /**
    * render the current date events
    *
@@ -115,7 +124,7 @@ export class VegaCalendarMonthEventRenderer extends VegaSlimmer {
       });
       return (h("div", { class: "month-event-more" },
         h("vega-popover", { trigger: "click", placement: "right", padding: '0', ref: (el) => {
-            this.setPopoverHideObserver(el);
+            this.setPopoverObserver(el);
           }, isScreenPosition: true },
           h("div", { tabIndex: 0, slot: "popover-content", role: "button", class: "more-button", onKeyDown: createEnterKeyHandlerToTriggerClick() }, `${moreItemsLength} More`),
           h("vega-flex", { slot: "popover" },
@@ -185,7 +194,7 @@ export class VegaCalendarMonthEventRenderer extends VegaSlimmer {
     }
     return rowEvents;
   }
-  setPopoverHideObserver(popover) {
+  setPopoverObserver(popover) {
     if (popover) {
       this.popoverHideObserver = new Observer((_payload) => true, async () => await popover.hide());
       ChangeManager.register(DomNodeSubjectFactory.getSubject(this.host, VegaInternalCalendarEventPreviewHide), this.popoverHideObserver);
@@ -194,10 +203,20 @@ export class VegaCalendarMonthEventRenderer extends VegaSlimmer {
       ChangeManager.unregister(DomNodeSubjectFactory.getSubject(this.host, VegaInternalCalendarEventPreviewHide), this.popoverHideObserver);
     }
     // we should clear current event in vega-calendar-event-preview when popover hide
-    popover &&
+    if (popover) {
       DomNodeSubjectObserverFactory.addUniqueObserverToNode(popover, VegaPopoverHide, () => {
+        this.isGroupEventPreviewingFlag = false;
         ChangeManager.notify(DomNodeSubjectFactory.getSubject(this.renderer.getEventPreviewRef(), VegaInternalCalendarEventPreviewClear), {});
       });
+      DomNodeSubjectObserverFactory.addUniqueObserverToNode(popover, VegaPopoverShow, () => {
+        this.isGroupEventPreviewingFlag = true;
+      });
+    }
+    else if (this.groupPopoverRef) {
+      DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.groupPopoverRef, VegaPopoverHide);
+      DomNodeSubjectObserverFactory.removeUniqueObserverFromNode(this.groupPopoverRef, VegaPopoverShow);
+    }
+    this.groupPopoverRef = popover;
   }
 }
 __decorate([

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

@@ -14,7 +14,7 @@ import { VegaCalendarMonthViewRenderer } from './slimmers/month-view/renderers/v
 import { VegaCalendarViewWithTimeRenderer } from './slimmers/day-view/renderers/vega-calendar-view-with-time-renderer';
 import { VegaCalendarTimeLineRenderer } from './slimmers/day-view/renderers/vega-calendar-time-line-renderer';
 import { createEventEmitSlimmer, } from '../../helpers/event-manager/slimmers/event-emit-slimmer';
-import { VegaChange, VegaDateClick, VegaDateDblClick, VegaEventClick, VegaEventEdit, VegaMoreActionClick, } from '../../helpers/event-manager/event-id/vega-event-id';
+import { VegaChange, VegaDateClick, VegaDateDblClick, VegaEventClick, VegaEventEdit, VegaEventPreview, VegaMoreActionClick, } from '../../helpers/event-manager/event-id/vega-event-id';
 import { CalendarDate } from '../../helpers/calendar';
 import { VegaCalendarViewController } from './slimmers/common/controllers/vega-calendar-view-controller';
 import { VegaCalendarCurrentPeriodController } from './slimmers/common/controllers/vega-calendar-current-period-controller';
@@ -77,6 +77,7 @@ export class VegaCalendar {
     this.eventResponsiveController = new VegaCalendarEventResponsiveController();
     this.changeEventEmitter = createEventEmitSlimmer(VegaCalendar, VegaChange);
     this.eventClickEmitter = createEventEmitSlimmer(VegaCalendar, VegaEventClick);
+    this.eventPreviewEmitter = createEventEmitSlimmer(VegaCalendar, VegaEventPreview);
     this.dateDblClickEmitter = createEventEmitSlimmer(VegaCalendar, VegaDateDblClick);
     this.moreActionClickEmitter = createEventEmitSlimmer(VegaCalendar, VegaMoreActionClick);
     this.dateClickEmitter = createEventEmitSlimmer(VegaCalendar, VegaDateClick);
@@ -551,6 +552,29 @@ export class VegaCalendar {
           }],
         "text": "A callback function that determines the visibility of action buttons in the event preview popover for each calendar event.\nIt receives the raw event data and the associated date, and should return an object indicating which action buttons should be visible in the popover.\nThis allows for dynamic customization of the event preview based on the specific event being clicked."
       }
+    },
+    "eventPreviewPopoverProps": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "VegaCalendarEventPreviewPopoverProps",
+        "resolved": "{ trigger: \"click\" | \"hover\"; }",
+        "references": {
+          "VegaCalendarEventPreviewPopoverProps": {
+            "location": "import",
+            "path": "./types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.101.0"
+          }],
+        "text": "Configuration options for the event preview popover behavior.\nAllows customization of how the popover is triggered (hover or click).\nBy default, the popover triggers on click."
+      }
     }
   }; }
   static get states() { return {
@@ -609,6 +633,55 @@ export class VegaCalendar {
           }
         }
       }
+    }, {
+      "method": "vegaEventPreview",
+      "name": "vegaEventPreview",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.101.0"
+          }],
+        "text": "An event emitter notifying that a calendar event is ready to review."
+      },
+      "complexType": {
+        "original": "VegaCalendarEventPreviewInfo",
+        "resolved": "{ rawEvent: VegaCalendarRawEvent; }",
+        "references": {
+          "VegaCalendarEventPreviewInfo": {
+            "location": "import",
+            "path": "./types"
+          }
+        }
+      }
+    }, {
+      "method": "eventPreview",
+      "name": "eventPreview",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [{
+            "name": "eventSemantics",
+            "text": "namespace:native"
+          }, {
+            "name": "vegaVersion",
+            "text": "2.101.0"
+          }],
+        "text": "An event emitter notifying that a calendar event is ready to review."
+      },
+      "complexType": {
+        "original": "VegaCalendarEventPreviewInfo",
+        "resolved": "{ rawEvent: VegaCalendarRawEvent; }",
+        "references": {
+          "VegaCalendarEventPreviewInfo": {
+            "location": "import",
+            "path": "./types"
+          }
+        }
+      }
     }, {
       "method": "vegaEventClick",
       "name": "vegaEventClick",
@@ -1007,6 +1080,9 @@ __decorate([
 __decorate([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "eventClickEmitter", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaCalendar.prototype, "eventPreviewEmitter", void 0);
 __decorate([
   InjectVegaSlimmer()
 ], VegaCalendar.prototype, "dateDblClickEmitter", void 0);

package/dist/collection/components/vega-flag-icon/slimmers/controllers/vega-flag-icon-controller.js

@@ -48,14 +48,14 @@ export class VegaFlagIconController extends VegaSlimmer {
     };
   }
   /**
-   * componentWillLoad
+   * connectedCallback
    */
-  componentWillLoad() {
+  connectedCallback() {
     if (!this.country)
       return;
-    const hasIcon = this.isFlagForCountryCodeLoaded(this.country);
-    if (!hasIcon)
+    if (!this.isFlagForCountryCodeLoaded(this.country)) {
       this.registerObserver();
+    }
   }
   /**
    * disconnectedCallback
@@ -95,8 +95,8 @@ __decorate([
   MapToComponentField()
 ], VegaFlagIconController.prototype, "country", void 0);
 __decorate([
-  MapToComponentMethod('componentWillLoad')
-], VegaFlagIconController.prototype, "componentWillLoad", null);
+  MapToComponentMethod('connectedCallback')
+], VegaFlagIconController.prototype, "connectedCallback", null);
 __decorate([
   MapToComponentMethod('disconnectedCallback')
 ], VegaFlagIconController.prototype, "unRegisterObserver", null);

package/dist/collection/components/vega-input-phone-number/slimmers/renderers/country-select-renderer.js

@@ -8,11 +8,10 @@ import { h } from '@stencil/core';
 import { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
 import { DomNodeSubjectObserverFactory } from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-observer-factory';
 import { VegaChange } from '../../../../helpers/event-manager/event-id/vega-event-id';
-import { VegaInternalIconManager } from '../../../../helpers/icon/internal-icon-manager';
 import { getCountryCallingCode } from '../../../../polyfill/libphonenumber';
 import { COUNTRIES } from '../../assets/countries';
 import remoteInvocationRegistry from '../../../../helpers/remote-invocation/remote-invocation-registry';
-import { VegaDropdownRenderItemInternalOverridden, VegaInputSelectRenderPrefixIconInternalOverridden, } from '../../../../helpers/event-manager/event-id/vega-internal-event-id';
+import { VegaDropdownRenderItemInternalOverridden } from '../../../../helpers/event-manager/event-id/vega-internal-event-id';
 import domNodeSubjectFactory from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
 import { FeatureFlag } from '../../../../helpers/feature-control/feature-flag-controller';
 export class CountrySelectRenderer extends VegaSlimmer {
@@ -93,7 +92,7 @@ export class CountrySelectRenderer extends VegaSlimmer {
           isScreenPosition: FeatureFlag.isEnabled('VEGA_INPUT_PHONE_NUMBER.ENABLE_CALCULATION_POSITION_BY_SCREEN'),
           matchTargetWidth: false,
           size: this.estimateMaxWidthOfCountries(countries),
-        }, size: this.size, prefixIcon: VegaInternalIconManager.getIconKey(this.countryCode), disabled: this.disabled, placeholder: "", ref: (inputSelect) => {
+        }, size: this.size, disabled: this.disabled, placeholder: "", ref: (inputSelect) => {
           this.inputSelectRef = inputSelect;
           DomNodeSubjectObserverFactory.addUniqueObserverToNode(inputSelect, VegaChange, 
           /*
@@ -105,11 +104,8 @@ export class CountrySelectRenderer extends VegaSlimmer {
             this.handleCountrySelectChange(e.detail);
           });
           remoteInvocationRegistry.register(domNodeSubjectFactory.getSubject(this.host, VegaDropdownRenderItemInternalOverridden), this.renderDropdownItem.bind(this));
-          remoteInvocationRegistry.register(domNodeSubjectFactory.getSubject(this.host, VegaInputSelectRenderPrefixIconInternalOverridden), this.renderDropdownPrefixIconWithFlagIcon.bind(this));
-        }, value: this.countryCode })));
-  }
-  renderDropdownPrefixIconWithFlagIcon(prefixIcon) {
-    return h("vega-flag-icon", { country: prefixIcon.split(' ')[1] });
+        }, value: this.countryCode },
+        h("vega-flag-icon", { slot: "prefix", country: this.countryCode }))));
   }
   /*
    * The below method is e2e-test covered in

package/dist/collection/components/vega-input-select/slimmers/renderers/vega-input-select-prefix-icon-renderer.js

@@ -6,35 +6,12 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
 import { h } from '@stencil/core';
-import domNodeSubjectFactory from '../../../../helpers/change-manager/subject/dom-node-subject/dom-node-subject-factory';
-import { VegaInputSelectRenderPrefixIconInternalOverridden } from '../../../../helpers/event-manager/event-id/vega-internal-event-id';
-import remoteInvocationRegistry from '../../../../helpers/remote-invocation/remote-invocation-registry';
-/** Manager remote invocation */
 export class VegaInputSelectPrefixIconRenderer extends VegaSlimmer {
-  /**
-   * Component lifecycle - connectedCallback
-   */
-  connectedCallback() {
-    this.remotePhoneNumberPrefixIconRenderSubject =
-      domNodeSubjectFactory.getSubjectFromParentNodeByEventId(this.host, VegaInputSelectRenderPrefixIconInternalOverridden);
-  }
-  /**
-   * Call the render function in input-phone-number.
-   *
-   * @param {unknown[]} args - arguments of remote search function
-   * @returns {Nullable<HTMLVegaFlagIconElement>} - returned vega-flag-icon.
-   */
-  callRemotePrefixIconRender(...args) {
-    if (this.remotePhoneNumberPrefixIconRenderSubject) {
-      const renderResult = remoteInvocationRegistry.call(this.remotePhoneNumberPrefixIconRenderSubject, ...args);
-      if (renderResult)
-        return renderResult;
-    }
-    return null;
+  checkPrefixSlotPresence() {
+    this.hasPrefixSlot = this.host.querySelector('[slot="prefix"]') !== null;
   }
   render() {
-    const renderResult = this.callRemotePrefixIconRender(this.prefixIcon);
-    return (this.prefixIcon && (h("div", { class: "vega-input-select-prefix-icon" }, renderResult ? (renderResult) : (h("vega-icon", { icon: this.prefixIcon, size: "size-16" })))));
+    return ((this.hasPrefixSlot || this.prefixIcon) && (h("div", { class: "vega-input-select-prefix-icon" }, this.hasPrefixSlot ? (h("slot", { name: "prefix" })) : (h("vega-icon", { icon: this.prefixIcon, size: "size-16" })))));
   }
 }
 __decorate([
@@ -44,5 +21,8 @@ __decorate([
   MapToComponentField()
 ], VegaInputSelectPrefixIconRenderer.prototype, "prefixIcon", void 0);
 __decorate([
-  MapToComponentMethod('connectedCallback')
-], VegaInputSelectPrefixIconRenderer.prototype, "connectedCallback", null);
+  MapToComponentField({ writable: true })
+], VegaInputSelectPrefixIconRenderer.prototype, "hasPrefixSlot", void 0);
+__decorate([
+  MapToComponentMethod('componentWillLoad')
+], VegaInputSelectPrefixIconRenderer.prototype, "checkPrefixSlotPresence", null);

package/dist/collection/components/vega-input-select/vega-input-select.js

@@ -83,6 +83,7 @@ export class VegaInputSelect {
     this.isDropdownShow = false;
     this.currentBreakpoint = getCurrentBreakpoint();
     this.isLazyLoading = false;
+    this.hasPrefixSlot = false;
     /**
      * Specifies the label or title for the input field.
      *
@@ -801,7 +802,8 @@ export class VegaInputSelect {
     "isDropdownShow": {},
     "currentBreakpoint": {},
     "isLazyLoading": {},
-    "selectedItem": {}
+    "selectedItem": {},
+    "hasPrefixSlot": {}
   }; }
   static get events() { return [{
       "method": "vegaChange",

package/dist/collection/components/vega-rich-text-editor/dto/blocks/list-item-block.js

@@ -1,4 +1,3 @@
-import { RTETextNode } from '../nodes/text-node';
 import { RTEListBlock } from './list-block';
 import { ModifyContentActionType } from '../actions/modify-content-action.abstract';
 import { AppendChildrenAction } from '../actions/append-child-nodes-action';
@@ -47,7 +46,7 @@ export class RTEListItemBlock extends RTETextBlock {
    */
   static from(block, options = { autoMatchFormat: true }) {
     const listItemBlock = new RTEListItemBlock(block.id, undefined, options);
-    listItemBlock.children = block.nodes.map((richText) => RTETextNode.from(richText, listItemBlock, options));
+    listItemBlock.children = RTEListItemBlock.convertNodes(block.nodes, listItemBlock, options);
     if (block.children) {
       listItemBlock.nestList = block.children.map((child) => {
         const listBlock = RTEListBlock.from(child, options);

package/dist/collection/components/vega-rich-text-editor/dto/blocks/text-block.js

@@ -56,18 +56,30 @@ export class RTETextBlock extends RTEBlock {
     const textBlock = new RTETextBlock(block.id, block.type, options);
     const annotations = options.autoMatchFormat
       ? Object.assign(Object.assign({}, block.annotations), { textStyle: (_b = (_a = block.annotations) === null || _a === void 0 ? void 0 : _a.textStyle) !== null && _b !== void 0 ? _b : textBlock.type }) : block.annotations;
-    textBlock.children = block.nodes
+    textBlock.children = RTETextBlock.convertNodes(block.nodes, textBlock, options);
+    if (annotations) {
+      super.convertAnnotationsToMap(textBlock.annotationMap, annotations);
+    }
+    return textBlock;
+  }
+  /**
+   * Convert raw node payloads to their registered `RTENode` subclasses via
+   * `RTEDTOClassManager`, preserving custom types (e.g. `RTETokenNode`).
+   *
+   * @param {VegaRTETextNode[]} nodes - Raw node payloads.
+   * @param {RTETextBlock} parent - Parent block for the converted nodes.
+   * @param {VegaRTETransformOptions} [options] - Optional transform options.
+   * @returns {RTETextNode[]} Converted nodes; unregistered types are dropped.
+   */
+  static convertNodes(nodes, parent, options) {
+    return nodes
       .map((richText) => {
       const NodeClass = RTEDTOClassManager.getRTENodeClass(richText.type);
       if (NodeClass) {
-        return NodeClass.from(richText, textBlock, options);
+        return NodeClass.from(richText, parent, options);
       }
     })
       .filter(isNonNullable);
-    if (annotations) {
-      super.convertAnnotationsToMap(textBlock.annotationMap, annotations);
-    }
-    return textBlock;
   }
   /**
    * The function `createAnnotationEntity` creates a block annotation entity based on the provided type

package/dist/collection/components/vega-segment-control/slimmers/renderers/vega-segment-renderer.js

@@ -15,7 +15,11 @@ export class VegaSegmentRenderer extends VegaSlimmer {
         [`${this.size}`]: true,
       }, 
       // eslint-disable-next-line react/jsx-no-bind
-      onClick: () => this.selectedController.setSelected(props), disabled: props.disabled }, this.renderSegments(props)));
+      onClick: () => this.selectedController.setSelected(props), disabled: props.disabled, ref: (ref) => {
+        if (ref && this.segmentButtonRef) {
+          this.segmentButtonRef(ref, props);
+        }
+      } }, this.renderSegments(props)));
   }
   /** The below method is e2e-test covered in
    *  @see{module:vega-segment-control-set-block-e2e}
@@ -66,3 +70,6 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaSegmentRenderer.prototype, "selectedController", void 0);
+__decorate([
+  MapToComponentField()
+], VegaSegmentRenderer.prototype, "segmentButtonRef", void 0);

package/dist/collection/components/vega-segment-control/vega-segment-control.js

@@ -218,6 +218,29 @@ export class VegaSegmentControl {
       "attribute": "variant",
       "reflect": false,
       "defaultValue": "'default'"
+    },
+    "segmentButtonRef": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "VegaSegmentButtonRef",
+        "resolved": "(ref: HTMLButtonElement, segment: VegaSegmentProps) => void",
+        "references": {
+          "VegaSegmentButtonRef": {
+            "location": "import",
+            "path": "./types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.101.0"
+          }],
+        "text": "Callback invoked when a segment button element is rendered."
+      }
     }
   }; }
   static get states() { return {

package/dist/collection/components/vega-table/slimmers/controllers/dto/column-render-input-model.js

@@ -48,6 +48,23 @@ export class ColumnRenderInputModel {
     this.columnIndex = columnIndex;
     this.parent = parent;
     this.children = children;
+    /**
+     * Prefix-sum pixel offset for `sticky left` positioning. Mutated by
+     * {@link VegaTableRenderInputController.recomputePinnedOffsets} on resize / column
+     * structure change. Consumed by the cell's own `render()` to emit `style.left`
+     * declaratively instead of receiving external shadow-DOM style mutation.
+     * Null when the column is not left-pinned or offsets have not yet been computed.
+     */
+    this.leftOffsetPx = null;
+    /**
+     * Prefix-sum pixel offset for `sticky right` positioning. Mirrors
+     * {@link leftOffsetPx} but for right-pinned columns.
+     */
+    this.rightOffsetPx = null;
+    this.isVisibleLeftEndPinned = false;
+    this.isVisibleRightStartPinned = false;
+    this.isVisibleRightEndPinned = false;
+    this.visibleColSpan = null;
     this.iteratorCacheMap = new Map();
     this.leaves = [];
   }
@@ -108,14 +125,14 @@ export class ColumnRenderInputModel {
       isNoPinnedEnd = isNoPinnedEnd || leaf.isNoPinnedEnd;
       isViewEnd = isViewEnd || leaf.isViewEnd;
     }
-    // Return the base unchanged when no flags were gained (common fast-path).
-    if (isLeftEndPinned === base.isLeftEndPinned &&
-      isRightStartPinned === base.isRightStartPinned &&
-      isNoPinnedEnd === base.isNoPinnedEnd &&
-      isViewEnd === base.isViewEnd) {
-      return base;
-    }
-    return new ColumnRenderInputModel(base.key, base.label, base.pinned, base.colSpan, base.rowSpan, base.isViewStart, isViewEnd, isLeftEndPinned, isRightStartPinned, isNoPinnedEnd, base.headHasGroupColumn, base.headHasPinnedColumn, base.headMaxDepth, base.level, base.columnIndex, base.parent, base.children);
+    const renderInput = new ColumnRenderInputModel(base.key, base.label, base.pinned, base.colSpan, base.rowSpan, base.isViewStart, isViewEnd, isLeftEndPinned, isRightStartPinned, isNoPinnedEnd, base.headHasGroupColumn, base.headHasPinnedColumn, base.headMaxDepth, base.level, base.columnIndex, base.parent, base.children);
+    renderInput.leftOffsetPx = base.leftOffsetPx;
+    renderInput.rightOffsetPx = base.rightOffsetPx;
+    renderInput.isVisibleLeftEndPinned = base.isVisibleLeftEndPinned;
+    renderInput.isVisibleRightStartPinned = base.isVisibleRightStartPinned;
+    renderInput.isVisibleRightEndPinned = base.isVisibleRightEndPinned;
+    renderInput.visibleColSpan = base.visibleColSpan;
+    return renderInput;
   }
   /**
    * True when the provided structure model is the last left-pinned sibling in its parent's children.