@heartlandone/vega 2.81.0 → 2.83.0

package/dist/collection/components/vega-image-uploader/slimmers/renderers/vega-image-uploader-preview-content-renderer.js

@@ -8,6 +8,21 @@ import { h } from '@stencil/core';
 import { MapToComponentField, VegaSlimmer } from 'vega-slimmer/core';
 /** The VegaImageUploaderPreviewContentRenderer class is responsible for rendering an image preview container with an image and optional actions element. */
 export class VegaImageUploaderPreviewContentRenderer extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    /**
+     * Prevents the browser's default behavior on drag/drop events over the image preview.
+     * Without this, dropping a file onto the already-populated preview would cause the browser
+     * to navigate to (and open) the dropped file. The component does not support replacing the
+     * image via drag-and-drop while a preview is shown, so we simply no-op here, matching the
+     * disabled-state behavior.
+     *
+     * @param {DragEvent} e drag event object
+     */
+    this.preventDefaultDragEvent = (e) => {
+      e.preventDefault();
+    };
+  }
   /**
    * The function renders an image preview container with an image and optional actions element.
    *
@@ -19,7 +34,7 @@ export class VegaImageUploaderPreviewContentRenderer extends VegaSlimmer {
     return (h("div", { class: {
         'image-preview-container': true,
         'actions-backdrop': actionsElement ? true : false,
-      }, tabIndex: 0, role: "menu" },
+      }, tabIndex: 0, role: "menu", onDrop: this.preventDefaultDragEvent, onDragEnter: this.preventDefaultDragEvent, onDragOver: this.preventDefaultDragEvent },
       h("img", { src: imagePreviewURL, alt: "" }),
       actionsElement));
   }

package/dist/collection/components/vega-image-uploader/vega-image-uploader.js

@@ -18,6 +18,7 @@ import { VegaImageUploaderPreviewContentRenderer } from './slimmers/renderers/ve
 import { VegaImageUploaderUploadingContentRenderer } from './slimmers/renderers/vega-image-uploader-uploading-content-renderer';
 import { VegaImageUploaderDefaultContentRenderer } from './slimmers/renderers/vega-image-uploader-default-content-renderer';
 import { VegaImageUploaderRemoveController } from './slimmers/controllers/vega-image-uploader-remove-controller';
+import { DropFileAcceptFilterSlimmer } from '../../helpers/slimmers/drop-file-accept-filter-slimmer';
 import { FormFieldControllerSlimmer } from '../../helpers/slimmers/form-field-controller-slimmer';
 import { VegaImageUploaderActionsVisibilityController } from './slimmers/controllers/vega-image-uploader-actions-visibility-controller';
 import { ChildNodesEventPreventSlimmer } from '../../helpers/event-manager/slimmers/child-nodes-event-prevent-slimmer';
@@ -46,6 +47,7 @@ export class VegaImageUploader {
     this.vegaImageUploaderValueController = new VegaImageUploaderValueController();
     this.vegaImageUploaderPreviewController = new VegaImageUploaderPreviewController();
     this.vegaImageUploaderRemoveController = new VegaImageUploaderRemoveController();
+    this.dropFileFilterController = new DropFileAcceptFilterSlimmer();
     this.actionsVisibilityController = new VegaImageUploaderActionsVisibilityController();
     this.darkModeStateControllerSlimmer = new DarkModeStateControllerSlimmer();
     this.formFieldController = new FormFieldControllerSlimmer({
@@ -782,6 +784,9 @@ __decorate([
 __decorate([
   InjectVegaSlimmer()
 ], VegaImageUploader.prototype, "vegaImageUploaderRemoveController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaImageUploader.prototype, "dropFileFilterController", void 0);
 __decorate([
   InjectVegaSlimmer()
 ], VegaImageUploader.prototype, "actionsVisibilityController", void 0);

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

@@ -51,7 +51,7 @@ export class VegaInputSelectDropdownRenderer extends VegaSlimmer {
           : // eslint-disable-next-line  @typescript-eslint/no-non-null-assertion
             this.selectedLabel.multiple(this.value, this.selectedItem);
         return (h("span", { class: "vega-input-select-selected" },
-          h("vega-text", { overflow: "ellipsis", tooltip: { placement: 'bottom' }, key: selectedLabelStr }, selectedLabelStr)));
+          h("vega-text", { overflow: "ellipsis", tooltip: this.getSelectedLabelTooltipProps(), key: selectedLabelStr }, selectedLabelStr)));
       }
       else {
         return (h("div", { class: "vega-input-select-placeholder" }, this.translationSlimmer.t(this.placeholder)));
@@ -68,7 +68,7 @@ export class VegaInputSelectDropdownRenderer extends VegaSlimmer {
         (typeof this.selectedLabel != 'function' && selectedLabelStr)) {
         if (typeof this.selectedLabel == 'function') {
           return (h("span", { class: "vega-input-select-selected", part: "selected-box" },
-            h("vega-text", { overflow: "ellipsis", tooltip: { placement: 'bottom' }, key: 
+            h("vega-text", { overflow: "ellipsis", tooltip: this.getSelectedLabelTooltipProps(), key: 
               // eslint-disable-next-line  @typescript-eslint/no-non-null-assertion
               selectedSourceItemItem.displayName }, 
             // eslint-disable-next-line  @typescript-eslint/no-non-null-assertion
@@ -76,7 +76,7 @@ export class VegaInputSelectDropdownRenderer extends VegaSlimmer {
         }
         else {
           return (h("span", { class: "vega-input-select-selected", part: "selected-box" },
-            h("vega-text", { overflow: "ellipsis", tooltip: { placement: 'bottom' }, key: selectedLabelStr }, selectedLabelStr)));
+            h("vega-text", { overflow: "ellipsis", tooltip: this.getSelectedLabelTooltipProps(), key: selectedLabelStr }, selectedLabelStr)));
         }
       }
       else {
@@ -84,7 +84,14 @@ export class VegaInputSelectDropdownRenderer extends VegaSlimmer {
       }
     };
     this.getVegaDropdownProperties = () => {
-      return Object.assign({ searchable: true, caseSensitive: false }, this.vegaDropdownProps);
+      const dropdownProperties = Object.assign({ searchable: true, caseSensitive: false }, this.vegaDropdownProps);
+      if (this.dropdownItemTooltipProps && Object.keys(this.dropdownItemTooltipProps).length > 0) {
+        dropdownProperties.itemTooltipProps = this.dropdownItemTooltipProps;
+      }
+      return dropdownProperties;
+    };
+    this.getSelectedLabelTooltipProps = () => {
+      return Object.assign({ placement: 'bottom' }, this.selectedLabelTooltipProps);
     };
   }
   watchVegaDropdownProps() {
@@ -184,6 +191,12 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaInputSelectDropdownRenderer.prototype, "selectedItem", void 0);
+__decorate([
+  MapToComponentField()
+], VegaInputSelectDropdownRenderer.prototype, "selectedLabelTooltipProps", void 0);
+__decorate([
+  MapToComponentField()
+], VegaInputSelectDropdownRenderer.prototype, "dropdownItemTooltipProps", void 0);
 __decorate([
   MapToComponentMethod('watchVegaDropdownProps')
 ], VegaInputSelectDropdownRenderer.prototype, "watchVegaDropdownProps", null);

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

@@ -187,6 +187,22 @@ export class VegaInputSelect {
      * @vegaVersion 1.3.0
      */
     this.vegaDropdownProps = {};
+    /**
+     * Provides tooltip configuration for the selected label text.
+     *
+     * Use this to control tooltip placement, width, and other display properties.
+     *
+     * @vegaVersion 2.82.0
+     */
+    this.selectedLabelTooltipProps = {};
+    /**
+     * Provides tooltip configuration for dropdown items.
+     *
+     * Use this to control tooltip placement and width for long item labels.
+     *
+     * @vegaVersion 2.82.0
+     */
+    this.dropdownItemTooltipProps = {};
     /**
      * Defines the size of the input select field.
      *
@@ -209,6 +225,12 @@ export class VegaInputSelect {
   watchVegaDropdownProps() {
     methodPlaceholder();
   }
+  watchSelectedLabelTooltipProps() {
+    methodPlaceholder();
+  }
+  watchDropdownItemTooltipProps() {
+    methodPlaceholder();
+  }
   componentWillLoad() {
     methodPlaceholder();
   }
@@ -599,6 +621,54 @@ export class VegaInputSelect {
       },
       "defaultValue": "{}"
     },
+    "selectedLabelTooltipProps": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "VegaInputSelectTooltipProps",
+        "resolved": "{ minWidth?: ResponsiveType<SizeType>; maxWidth?: ResponsiveType<SizeType>; placement?: ElementAppenderPlacementType; }",
+        "references": {
+          "VegaInputSelectTooltipProps": {
+            "location": "import",
+            "path": "./types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.82.0"
+          }],
+        "text": "Provides tooltip configuration for the selected label text.\n\nUse this to control tooltip placement, width, and other display properties."
+      },
+      "defaultValue": "{}"
+    },
+    "dropdownItemTooltipProps": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "VegaInputSelectDropdownTooltipProps",
+        "resolved": "{ minWidth?: ResponsiveType<SizeType>; maxWidth?: ResponsiveType<SizeType>; placement?: ElementAppenderPlacementType; }",
+        "references": {
+          "VegaInputSelectDropdownTooltipProps": {
+            "location": "import",
+            "path": "./types"
+          }
+        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "vegaVersion",
+            "text": "2.82.0"
+          }],
+        "text": "Provides tooltip configuration for dropdown items.\n\nUse this to control tooltip placement and width for long item labels."
+      },
+      "defaultValue": "{}"
+    },
     "size": {
       "type": "string",
       "mutable": false,
@@ -966,6 +1036,12 @@ export class VegaInputSelect {
     }, {
       "propName": "vegaDropdownProps",
       "methodName": "watchVegaDropdownProps"
+    }, {
+      "propName": "selectedLabelTooltipProps",
+      "methodName": "watchSelectedLabelTooltipProps"
+    }, {
+      "propName": "dropdownItemTooltipProps",
+      "methodName": "watchDropdownItemTooltipProps"
     }]; }
 }
 __decorate([

package/dist/collection/components/vega-modal/slimmers/controllers/vega-modal-backdrop-controller.js

@@ -29,18 +29,23 @@ export class VegaModalBackdropController extends VegaSlimmer {
    * Set backdrop of modal.
    */
   setBackdrop() {
+    var _a;
     if (this.backdrop === 'none')
       return;
     // eslint-disable-next-line no-restricted-globals
-    let backdrop = document.querySelector('vega-backdrop.modal-backdrop');
+    let backdrop = document.querySelector(`vega-backdrop.${VegaModalBackdropController.modalBackdropClass}`);
     if (!backdrop) {
       // eslint-disable-next-line no-restricted-globals
       backdrop = document.createElement('vega-backdrop');
-      backdrop.classList.add('modal-backdrop');
+      backdrop.classList.add(VegaModalBackdropController.modalBackdropClass);
       backdrop.color = VegaModalBackdropController.backdropColorMap[this.backdropColor];
       backdrop.visible = true;
+      // Append backdrop as a sibling of the modal host so it shares the same stacking context.
+      // - When vega-modal is in document.body (normal case), parentElement is document.body.
+      // - When vega-modal is inside a third-party dialog (e.g. Bootstrap modal), parentElement is the dialog container — keeping the backdrop inside the focus-trap root.
+      // - Falls back to document.body when parentElement is null (e.g. VegaDialog creates the vega-modal element before appending it to the DOM).
       // eslint-disable-next-line no-restricted-globals
-      document.querySelector('body').append(backdrop);
+      ((_a = this.host.parentElement) !== null && _a !== void 0 ? _a : document.body).append(backdrop);
     }
     this.backdropRef = backdrop;
   }
@@ -51,6 +56,7 @@ export class VegaModalBackdropController extends VegaSlimmer {
     this.backdropRef && this.backdropRef.remove();
   }
 }
+VegaModalBackdropController.modalBackdropClass = 'vega-modal-backdrop';
 VegaModalBackdropController.backdropColorMap = {
   default: 'bg-backdrop-modal',
   semi: 'bg-backdrop-popover',

package/dist/collection/components/vega-modal/slimmers/controllers/vega-modal-open-state-controller.js

@@ -216,7 +216,6 @@ export class VegaModalOpenStateController extends VegaSlimmer {
     this.backdropController.setBackdrop();
     this.zIndexController.setModalZIndex();
     this.removeBackdropWhileNoModalShow();
-    this.layoutController.setModalWidth();
     this.emitEvent();
     this.setModalVisibility();
     this.ariaDialogToggle(this.openState.isOpen);
@@ -318,9 +317,6 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaModalOpenStateController.prototype, "openEventEmitter", void 0);
-__decorate([
-  MapToComponentField()
-], VegaModalOpenStateController.prototype, "layoutController", void 0);
 __decorate([
   MapToComponentField()
 ], VegaModalOpenStateController.prototype, "backdropController", void 0);

package/dist/collection/components/vega-modal/slimmers/controllers/vega-nested-modal-controller.js

@@ -4,11 +4,26 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
   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 { MapToComponentField, MapToComponentMethod, VegaSlimmer } from 'vega-slimmer/core';
+import { MapToComponentField, MapToComponentMethod } from 'vega-slimmer/core';
+import { MutationObserverSlimmer } from '../../../../helpers/slimmers/mutation-observer/mutation-observer-slimmer';
+import { TagNameMutationFilter } from '../../../../helpers/slimmers/mutation-observer/mutation-observer-filters';
 /**
  * Nested modal controller
  */
-export class VegaNestedModalController extends VegaSlimmer {
+export class VegaNestedModalController extends MutationObserverSlimmer {
+  constructor() {
+    super({
+      mutationFilter: TagNameMutationFilter('VEGA-MODAL'),
+      options: {
+        childList: true,
+        subtree: true,
+      },
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      callback: () => {
+        this.appendNestedModalToBody();
+      },
+    });
+  }
   /**
    * Component lifecycle - [connectedCallback]
    */

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

@@ -8,7 +8,8 @@ import { MapToComponentField, VegaSlimmer } from 'vega-slimmer/core';
 import { Fragment, h, Host } from '@stencil/core';
 import { generateUUID } from '../../../../utils/misc';
 import { createEnterKeyHandlerToTriggerClick } from '../../../../utils/accessibility';
-import { formatAndValidResponsiveToken } from '../../../../utils/design-token';
+import { DefaultModalSize } from '../../../../constants/ui';
+import { isResponsiveSizeType } from '../../../../types/type-guard';
 /**
  * Modal renderer
  */
@@ -23,59 +24,49 @@ export class VegaModalRenderer extends VegaSlimmer {
   getModalFooterRef() {
     return this.modalFooter;
   }
-  getModalDialogRef() {
-    return this.modalDialog;
-  }
   getModalContainerRef() {
     return this.modalContainer;
   }
   render() {
-    const margin = formatAndValidResponsiveToken(this.margin, 'margin');
     return (h(Host, { class: {
         'align-center': this.deprecatedPropertySlimmer.getValue() && this.openState.isOpen,
         'animation': this.animation,
       } },
-      h("div", { class: {
-          'modal-dialog': true,
-          [margin]: !!margin,
-        }, role: "dialog", "aria-modal": "true", "aria-labelledby": this.titleId, tabIndex: -1, ref: (node) => (this.modalDialog = node) }, this.renderContainer())));
+      h("vega-box", { class: "modal-dialog", role: "dialog", "aria-modal": "true", "aria-labelledby": this.titleId, width: isResponsiveSizeType(this.size) ? this.size : DefaultModalSize, height: this.height, margin: this.margin }, this.renderContainer())));
   }
   renderContainer() {
-    const padding = formatAndValidResponsiveToken(this.padding, 'padding');
     return (h("div", { class: "modal-container", ref: (node) => (this.modalContainer = node) },
-      this.renderHeader(padding),
-      this.renderContent(padding),
-      this.renderFooter(padding)));
+      this.renderHeader(),
+      this.renderContent(),
+      this.renderFooter()));
   }
-  renderHeader(padding) {
-    return (h("div", { class: {
+  renderHeader() {
+    return (h("vega-box", { class: {
         'vega-modal-header': true,
         'vega-modal-header-with-title': this.hasModalTitle(),
+        'vega-modal-header-with-slot': this.useModalSlotTitle(),
         'vega-modal-header-with-icon': this.showCloseButton,
         'vega-modal-header-with-content-scroll': this.isContentScrollable(),
-        [padding]: true,
-      }, id: this.titleId },
+      }, padding: this.padding, id: this.titleId },
       this.renderTitle(),
       this.showCloseButton && this.renderCloseBtn()));
   }
-  renderContent(padding) {
-    return (h("div", { class: {
+  renderContent() {
+    return (h("vega-box", { class: {
         'vega-modal-content': true,
         'vega-modal-content-with-scroll': this.isContentScrollable(),
-        [padding]: true,
-      }, ref: (e) => (this.modalContent = e) },
+      }, padding: this.padding, maxHeight: this.contentMaxHeight, ref: (e) => (this.modalContent = e) },
       h(Fragment, null,
         h("slot", null),
         h("slot", { name: "content" }),
         h("slot", { name: "modal-content" }))));
   }
-  renderFooter(padding) {
-    return (h("div", { class: {
+  renderFooter() {
+    return (h("vega-box", { class: {
         'vega-modal-footer': true,
         'vega-modal-footer-with-slot': this.hasModalFooter(),
         'vega-modal-footer-with-content-scroll': this.isContentScrollable(),
-        [padding]: true,
-      }, ref: (e) => (this.modalFooter = e) },
+      }, padding: this.padding, ref: (e) => (this.modalFooter = e) },
       h(Fragment, null,
         h("slot", { name: "footer" }),
         h("slot", { name: "modal-footer" }))));
@@ -97,9 +88,12 @@ export class VegaModalRenderer extends VegaSlimmer {
     return Boolean(this.contentMaxHeight);
   }
   hasModalTitle() {
-    return (Boolean(this.modalTitle) ||
-      this.host.querySelector(`[slot='modal-title']`) !== null ||
-      this.host.querySelector(`[slot='title']`) !== null);
+    return Boolean(this.modalTitle) || this.useModalSlotTitle();
+  }
+  useModalSlotTitle() {
+    return (!this.modalTitle &&
+      (this.host.querySelector(`[slot='modal-title']`) !== null ||
+        this.host.querySelector(`[slot='title']`) !== null));
   }
 }
 __decorate([
@@ -120,6 +114,12 @@ __decorate([
 __decorate([
   MapToComponentField()
 ], VegaModalRenderer.prototype, "margin", void 0);
+__decorate([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "size", void 0);
+__decorate([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "height", void 0);
 __decorate([
   MapToComponentField()
 ], VegaModalRenderer.prototype, "showCloseButton", void 0);

package/dist/collection/components/vega-modal/vega-modal.css

@@ -5243,8 +5243,8 @@
   padding-bottom: 0px;
 }
 
-.vega-modal-header.vega-modal-header-with-title,
-.vega-modal-header.vega-modal-header-with-icon {
+.vega-modal-header.vega-modal-header-with-title:not(.vega-modal-header-with-slot),
+.vega-modal-header.vega-modal-header-with-icon:not(.vega-modal-header-with-slot) {
   padding-bottom: 16px;
 }
 

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

@@ -17,7 +17,6 @@ import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/
 import { VegaModalRuntimeMetricsPayloadDefinition } from '../../constants/runtime-metrics-payload-definition/vega-modal/runtime-metrics-payload-definition';
 import { VegaNestedModalController } from './slimmers/controllers/vega-nested-modal-controller';
 import { VegaModalRenderer } from './slimmers/renderers/vega-modal-renderer';
-import { VegaModalLayoutController } from './slimmers/controllers/vega-modal-layout-controller';
 import { VegaModalMobileController } from './slimmers/controllers/vega-modal-mobile-controller';
 import { VegaModalScrollController } from './slimmers/controllers/vega-modal-scroll-controller';
 import { VegaModalOpenStateController } from './slimmers/controllers/vega-modal-open-state-controller';
@@ -35,7 +34,6 @@ export class VegaModal {
     this.openStateController = new VegaModalOpenStateController();
     this.mobileController = new VegaModalMobileController();
     this.scrollController = new VegaModalScrollController();
-    this.layoutController = new VegaModalLayoutController();
     this.backdropController = new VegaModalBackdropController();
     this.openedModalStackController = new VegaModalOpenedModalStackController();
     this.zIndexController = new VegaModalZIndexController();
@@ -738,9 +736,6 @@ __decorate([
 __decorate([
   InjectVegaSlimmer()
 ], VegaModal.prototype, "scrollController", void 0);
-__decorate([
-  InjectVegaSlimmer()
-], VegaModal.prototype, "layoutController", void 0);
 __decorate([
   InjectVegaSlimmer()
 ], VegaModal.prototype, "backdropController", void 0);

package/dist/collection/components/vega-pagination/internal/vega-pagination-go-to.js

@@ -21,7 +21,7 @@ export const VegaPaginationGoTo = ({ onChange, pageCount, translationSlimmer, })
       ref: (ref) => {
         DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaFormSubmit, handleChange);
       } },
-      h("vega-input", { "data-vega-form": "paginationGoTo", type: "number", size: "small", showClearIcon: false, style: { width: '60px' }, maskConfig: {
+      h("vega-input", { "data-vega-form": "paginationGoTo", type: "number", size: "small", autocomplete: "on", showClearIcon: false, style: { width: '60px' }, maskConfig: {
           type: 'number',
           options: {
             allowNegative: false,

package/dist/collection/components/vega-pagination/vega-pagination-page-selector-mobile/slimmers/renderers/page-selector-mobile-renderer.js

@@ -42,7 +42,7 @@ export class PageSelectorMobileRenderer extends VegaSlimmer {
       h("vega-form", { ref: (ref) => {
           DomNodeSubjectObserverFactory.addUniqueObserverToNode(ref, VegaFormSubmit, this.handleChange);
         } },
-        h("vega-input", { "data-vega-form": "pageSelectorMobile_goTo", size: "small", showClearIcon: false, style: { width: '54px' }, maskConfig: {
+        h("vega-input", { "data-vega-form": "pageSelectorMobile_goTo", size: "small", autocomplete: "on", showClearIcon: false, style: { width: '54px' }, maskConfig: {
             type: 'number',
             options: {
               allowNegative: false,

package/dist/collection/components/vega-progress-tracker/slimmers/controllers/vega-progress-tracker-current-step-controller.js

@@ -24,7 +24,9 @@ export class VegaProgressTrackerCurrentStepController extends VegaSlimmer {
      * @param {number} current - current step index
      */
     this.updateCurrent = (current) => {
-      this.current = normalizeNumberByRanger(current, 0, this.currentSteps.length - 1);
+      const maxIndex = Math.max(0, this.currentSteps.length - 1);
+      const minIndex = this.allowNoCurrentStep ? -1 : 0;
+      this.current = normalizeNumberByRanger(current, minIndex, maxIndex);
     };
   }
   /** connectedCallback */
@@ -62,7 +64,10 @@ export class VegaProgressTrackerCurrentStepController extends VegaSlimmer {
   }
   /** watch prevStep method call*/
   prevStep() {
-    this.updateCurrent(--this.current);
+    // In no-current-step mode, prevStep should keep -1 as the lower bound.
+    const minIndex = this.allowNoCurrentStep && this.current <= -1 ? -1 : 0;
+    const maxIndex = Math.max(0, this.currentSteps.length - 1);
+    this.current = normalizeNumberByRanger(--this.current, minIndex, maxIndex);
   }
   /**
    * watch setCurrent method call
@@ -112,6 +117,9 @@ __decorate([
 __decorate([
   MapToComponentField({ writable: true })
 ], VegaProgressTrackerCurrentStepController.prototype, "current", void 0);
+__decorate([
+  MapToComponentField()
+], VegaProgressTrackerCurrentStepController.prototype, "allowNoCurrentStep", void 0);
 __decorate([
   MapToComponentField()
 ], VegaProgressTrackerCurrentStepController.prototype, "currentStepUpdateEventEmitter", void 0);

package/dist/collection/components/vega-progress-tracker/slimmers/renderers/vega-progress-tracker-renderer.js

@@ -43,7 +43,7 @@ export class VegaProgressTrackerRenderer extends VegaSlimmer {
   }
   async gotoCarouselPage(current) {
     const targetCurrent = current !== null && current !== void 0 ? current : this.current;
-    if (this.carouselContainerRef.getBoundingClientRect().width > 0) {
+    if (targetCurrent >= 0 && this.carouselContainerRef.getBoundingClientRect().width > 0) {
       await this.carouselRef.goToPage(targetCurrent + 1);
     }
   }

package/dist/collection/components/vega-progress-tracker/vega-progress-tracker.js

@@ -91,6 +91,21 @@ export class VegaProgressTracker {
      * @vegaVersion 1.5.0
      */
     this.canClickStep = true;
+    /**
+     * When enabled, `current = -1` becomes a valid state that indicates
+     *    no highlighted/current step (e.g. all steps are pending or the
+     *    workflow has not started).
+     *
+     * Two ways to enter this state:
+     * - Set the `current` prop to `-1`.
+     * - Call the `setCurrent(-1)` method.
+     *
+     * @VegaHint `prevStep()` still clamps at `0` and will not take `current`
+     *    into `-1`.
+     *
+     * @vegaVersion 2.82.0
+     */
+    this.allowNoCurrentStep = false;
   }
   watchCurrentSteps() {
     methodPlaceholder();
@@ -301,6 +316,30 @@ export class VegaProgressTracker {
       "attribute": "can-click-step",
       "reflect": false,
       "defaultValue": "true"
+    },
+    "allowNoCurrentStep": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "VegaHint",
+            "text": "`prevStep()` still clamps at `0` and will not take `current`\ninto `-1`."
+          }, {
+            "name": "vegaVersion",
+            "text": "2.82.0"
+          }],
+        "text": "When enabled, `current = -1` becomes a valid state that indicates\n   no highlighted/current step (e.g. all steps are pending or the\n   workflow has not started).\n\nTwo ways to enter this state:\n- Set the `current` prop to `-1`.\n- Call the `setCurrent(-1)` method."
+      },
+      "attribute": "allow-no-current-step",
+      "reflect": false,
+      "defaultValue": "false"
     }
   }; }
   static get states() { return {

package/dist/collection/components/vega-rich-text-editor/extensions/extension.abstract.js

@@ -49,12 +49,27 @@ export class VegaRTEExtension {
   static registerFilterStylesStrategy(blockOrNodeClassName, strategy) {
     RTEFilterStylesStrategyRegistry.register(blockOrNodeClassName, strategy);
   }
+  /**
+   * Lifecycle hook called by the rich text editor before the first render
+   * (during `componentWillLoad`).  Override this method to perform per-host
+   * pre-render setup — for example, registering a host-specific toolbar button
+   * renderer via {@link registerToolbarButtonRenderer} so that each editor on
+   * the page gets its own isolated renderer instance.
+   *
+   * The default implementation is a no-op; subclasses may override selectively.
+   *
+   * @typedef HTMLVegaRichTextEditorElement - The type of the host rich text editor element.
+   * @param {HTMLVegaRichTextEditorElement} host - The host rich text editor element that is about to load.
+   */
+  prepareBeforeLoad(host) {
+    methodPlaceholder(host);
+  }
   /**
    * Initializes the RTE extension with the provided context.
    *
    * @param {RTEExtensionContext} context - The context of the RTE extension.
    */
-  initialExtension(context) {
+  initialExtensionAfterLoad(context) {
     this.extensionContext = context;
     rteExtensionContextManager.setExtensionContext(context);
   }
@@ -103,12 +118,22 @@ export class VegaRTEExtension {
   }
   /**
    * Register a toolbar button renderer for the extension.
+   * When a `host` element is provided the renderer is registered in the per-host map
+   * (via {@link RTEDTORendererManager#registerRTEToolbarButtonRendererForHost}), giving
+   * that host an isolated renderer instance that takes precedence over the global singleton.
+   * Omit `host` to fall back to the global registration (backwards-compatible default).
    *
    * @param {string} type - The type of the toolbar button.
    * @param {VegaRTEToolbarButtonRenderer} renderer - The renderer to register.
+   * @param {HTMLVegaRichTextEditorElement} [host] - Optional host element for per-host isolation.
    */
-  registerToolbarButtonRenderer(type, renderer) {
-    RTEDTORendererManager.registerRTEToolbarButtonRenderer(type, renderer);
+  registerToolbarButtonRenderer(type, renderer, host) {
+    if (host) {
+      RTEDTORendererManager.registerRTEToolbarButtonRendererForHost(host, type, renderer);
+    }
+    else {
+      RTEDTORendererManager.registerRTEToolbarButtonRenderer(type, renderer);
+    }
   }
   /**
    * This is a helper method that utilizes RTEUtils to register common strategies.