@globalpayments/vega 2.92.0 → 2.94.0

package/dist/types/components/vega-combo-box/types.d.ts

@@ -4,7 +4,12 @@
 export type VegaDropdownPropsForComboBox = Partial<
 	Pick<
 		HTMLVegaDropdownElement,
-		'positionRelativeTo' | 'maxHeight' | 'matchContainerHeight' | 'dynamicOption' | 'isLoading'
+		| 'positionRelativeTo'
+		| 'maxHeight'
+		| 'matchContainerHeight'
+		| 'dynamicOption'
+		| 'isLoading'
+		| 'allowSelectAll'
 	>
 >;
 /**

package/dist/types/components/vega-combo-box/vega-combo-box.d.ts

@@ -143,6 +143,7 @@ export declare class VegaComboBox {
    * @vegaVersion 1.11.0
    */
   vegaDropdownProps: VegaDropdownPropsForComboBox;
+  watchVegaDropdownProps(): void;
   /**
    * Determines whether to display the associated dropdown menu and
    *    filter its options based on the text entered into the combo box.

package/dist/types/components/vega-dropdown/constants.d.ts

@@ -0,0 +1 @@
+export declare const VEGA_DROPDOWN_SELECT_ALL_KEY: string;

package/dist/types/components/vega-dropdown/slimmers/controllers/vega-dropdown-appender-controller.d.ts

@@ -20,6 +20,8 @@ export declare class VegaDropdownAppenderController extends ElementAppenderSlimm
   placement: VegaDropdown['placement'];
   alignment: VegaDropdown['alignment'];
   renderer: VegaDropdown['renderer'];
+  sourceController: VegaDropdown['sourceController'];
+  selectAllController: VegaDropdown['selectAllController'];
   searchRenderer: VegaDropdown['searchRenderer'];
   showEventEmitter: VegaDropdown['showEventEmitter'];
   hideEventEmitter: VegaDropdown['hideEventEmitter'];

package/dist/types/components/vega-dropdown/slimmers/controllers/vega-dropdown-children-controller.d.ts

@@ -12,9 +12,11 @@ export declare class VegaDropdownChildrenController extends VegaSlimmer {
   listRenderer: VegaDropdown['listRenderer'];
   renderer: VegaDropdown['renderer'];
   selectedController: VegaDropdown['selectedController'];
+  selectAllController: VegaDropdown['selectAllController'];
   protected mutationObserver: MutationObserverSlimmer;
   private labelSet;
   private keySet;
+  private previousSelectableKeys;
   /**
    * Component lifecycle - [disconnectedCallback]
    */
@@ -31,6 +33,10 @@ export declare class VegaDropdownChildrenController extends VegaSlimmer {
    * The function "watchSource" synchronizes the dropdown current data.
    */
   watchSource(): void;
+  /**
+   * Manually sync template/slot-based data after dynamic DOM mutations.
+   */
+  syncTemplateData(): void;
   /**
    * The function checks if a given label exists in a label set.
    *
@@ -45,15 +51,38 @@ export declare class VegaDropdownChildrenController extends VegaSlimmer {
    * @returns {boolean} A boolean value indicating whether the given key exists in the keySet.
    */
   isKeyExist(key: string): boolean;
+  /**
+   * Returns the keys of all non-disabled slot items.
+   * Used by the Select All controller to enumerate selectable items in template/slot mode.
+   *
+   * @returns {string[]} Keys of selectable (non-disabled) template items.
+   */
+  getSelectableKeys(): string[];
   /**
    * The function syncs up the current data of a dropdown based on the render mode.
    */
   private syncUpDropdownCurrentData;
+  /**
+   * Updates previous selectable template keys and triggers re-render when Select All visibility changes.
+   *
+   */
+  private updateTemplateSelectableKeysAndRefresh;
+  /**
+   * Re-syncs Select All sentinel state for template mode after slot item mutations.
+   */
+  private syncTemplateSelectAllState;
   /**
    * The `syncUpDropdownCurrentDataBySlot` method is responsible for
    * synchronizing the current data in a dropdown based on the items present in the slot.
    */
   private collectKeyAndLabelFromSlot;
+  /**
+   * Check whether a template item belongs to the current dropdown instead of a nested dropdown.
+   *
+   * @param {HTMLVegaDropdownItemElement} item - Template mode dropdown item element.
+   * @returns {boolean} True only when the nearest dropdown ancestor is current host.
+   */
+  private isCurrentDropdownTemplateItem;
   /**
    * The function collects unique labels and keys from a nested array of objects.
    *
@@ -67,6 +96,13 @@ export declare class VegaDropdownChildrenController extends VegaSlimmer {
    * The below method is e2e-test covered in @see{module:vega-dropdown-items-dom-change-e2e}
    */
   private clearDropdownCurrentData;
+  /**
+   * Returns the dropdown content box element, or falls back to the host element if not yet available.
+   * Handles cases where `getDropdownContentBoxRef()` returns null during early lifecycle phases.
+   *
+   * @returns {HTMLElement} The dropdown content box or host element.
+   */
+  private getContainerElement;
   /**
    * The function `notifyTemplateItemsChange` notifies changes to dropdown items within a container element.
    */

package/dist/types/components/vega-dropdown/slimmers/controllers/vega-dropdown-select-all-controller.d.ts

@@ -0,0 +1,107 @@
+import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
+import { VegaDropdown } from '../../vega-dropdown';
+import { DropdownSourceItem, VegaDropdownSourceItem } from '../../types';
+/**
+ * Determine Select All indeterminate state from selected keys and selectable keys.
+ *
+ * @param {string[] | string} keys - Current selected keys.
+ * @param {string[]} allKeys - Selectable keys for current mode.
+ * @param {string} selectAllKey - Internal Select All sentinel key.
+ * @returns {boolean} True when selection is partial.
+ */
+export declare const calculateSelectAllIndeterminate: (keys: string[] | string, allKeys: string[], selectAllKey?: string) => boolean;
+/**
+ * Determine indeterminate state specifically for the Select All item.
+ *
+ * @param {string} itemKey - Current dropdown item key.
+ * @param {string[] | string} keys - Current selected keys.
+ * @param {DropdownSourceItem[]} source - Source items (used in source mode).
+ * @param {string} selectAllKey - Internal Select All sentinel key.
+ * @returns {boolean} True when current item is Select All and selection is partial.
+ */
+export declare const isSelectAllItemIndeterminate: (itemKey: string, keys: string[] | string, source: DropdownSourceItem[], selectAllKey?: string) => boolean;
+/**
+ * The `VegaDropdownSelectAllController` encapsulates all Select All behavior.
+ * It is used when allowSelectAll is enabled.
+ */
+export declare class VegaDropdownSelectAllController extends VegaSlimmer {
+  allowSelectAll: VegaDropdown['allowSelectAll'];
+  selectType: VegaDropdown['selectType'];
+  translationSlimmer: VegaDropdown['translationSlimmer'];
+  renderModeController: VegaDropdown['renderModeController'];
+  childrenController: VegaDropdown['childrenController'];
+  private readonly selectAllKey;
+  /**
+   * Determine if Select All behavior should be active for current dropdown mode.
+   *
+   * @returns {boolean} True when allowSelectAll is enabled and selectType is multiple.
+   */
+  isEnabled(): boolean;
+  /**
+   * Add synthetic Select All option to source when enabled.
+   *
+   * @param {VegaDropdownSourceItem[]} source - The original source array.
+   * @returns {VegaDropdownSourceItem[]} Source with Select All item added at the start, or original source if not enabled.
+   */
+  getSourceWithSelectAll(source: VegaDropdownSourceItem[]): VegaDropdownSourceItem[];
+  /**
+   * Remove internal Select All key from selected keys.
+   *
+   * @param {string[]} keys - The current selected keys array.
+   * @returns {string[]} Keys with the internal Select All key removed.
+   */
+  filterOutSelectAllKey(keys: string[]): string[];
+  /**
+   * Toggle key selection in multiple mode, including Select All interactions.
+   *
+   * @param {DropdownSourceItem[]} source - The full source array of dropdown items.
+   * @param {string[]} selectedKeys - The currently selected keys.
+   * @param {string} key - The key that was clicked.
+   * @returns {string[]} Updated selected keys after the toggle operation.
+   */
+  toggleSelectionForMultiple(source: DropdownSourceItem[], selectedKeys: string[], key: string): string[];
+  /**
+   * Keep Select All internal key aligned with current selected keys.
+   *
+   * @param {DropdownSourceItem[]} source - The full source array of dropdown items.
+   * @param {string[]} keys - The current selected keys to synchronize.
+   * @returns {string[]} Keys with Select All key added or removed based on whether all items are selected.
+   */
+  syncSelectedKeysWithSelectAll(source: DropdownSourceItem[], keys: string[]): string[];
+  /**
+   * Check if a key is valid for selection in multiple mode.
+   *
+   * @param {string} key - The key to check.
+   * @returns {boolean} True if the key is the internal Select All key and feature is enabled.
+   */
+  isAllowedVirtualKey(key: string): boolean;
+  /**
+   * Determine whether Select All should be rendered in an indeterminate state.
+   *
+   * @param {string[] | string} keys - Current selected keys.
+   * @param {DropdownSourceItem[]} source - Source items (used in source mode).
+   * @returns {boolean} True when some but not all selectable items are selected.
+   */
+  isSelectAllIndeterminate(keys: string[] | string, source: DropdownSourceItem[]): boolean;
+  /**
+   * Returns the internal Select All item key.
+   * Used by renderers to inject the synthetic Select All item into the template/slot list.
+   *
+   * @returns {string} The Select All key.
+   */
+  getSelectAllItemKey(): string;
+  /**
+   * Determine whether template/slot mode should render the synthetic Select All row.
+   *
+   * @returns {boolean} True when Select All is enabled in template mode and there is at least one selectable real item.
+   */
+  shouldRenderTemplateSelectAll(): boolean;
+  /**
+   * Collect selectable keys from the source or DOM while skipping disabled items.
+   * In slot/template mode, keys are read from the rendered DOM via the children controller.
+   *
+   * @param {DropdownSourceItem[]} source - The dropdown source array (used in source mode only).
+   * @returns {string[]} The keys that can be selected.
+   */
+  private getSelectableKeys;
+}

package/dist/types/components/vega-dropdown/slimmers/controllers/vega-dropdown-selected-controller.d.ts

@@ -1,5 +1,6 @@
 import { VegaSlimmer } from '../../../../vega-slimmer/vega-slimmer-core';
 import { VegaDropdown } from '../../vega-dropdown';
+import { VegaDropdownSelectAllController } from './vega-dropdown-select-all-controller';
 /**
  * The `VegaDropdownSelectedController` class handles the selection of items in a dropdown menu,
  * either adding them to an array or setting them as the only selected item.
@@ -15,7 +16,9 @@ export declare class VegaDropdownSelectedController extends VegaSlimmer {
   childrenController: VegaDropdown['childrenController'];
   renderModeController: VegaDropdown['renderModeController'];
   dropdownClickEventEmitter: VegaDropdown['dropdownClickEventEmitter'];
+  selectAllClickEventEmitter: VegaDropdown['selectAllClickEventEmitter'];
   resetEventEmitter: VegaDropdown['resetEventEmitter'];
+  selectAllController: VegaDropdownSelectAllController;
   /**
    * Component lifecycle - componentWillLoad
    */
@@ -46,6 +49,11 @@ export declare class VegaDropdownSelectedController extends VegaSlimmer {
    * @returns {void} -.
    */
   watchSelectType(): void;
+  /**
+   * The function `watchAllowSelectAll` normalizes selectedSourceKey when allowSelectAll changes,
+   * keeping the internal Select All key in sync with current selection state.
+   */
+  watchAllowSelectAll(): void;
   /**
    * The function "watchSelectedSourceKey" assigns a value to the variable "selectedSourceKey" by calling
    * the function "checkSelectedSourceKey" with the current value of "selectedSourceKey" as an argument.
@@ -111,6 +119,15 @@ export declare class VegaDropdownSelectedController extends VegaSlimmer {
    * @returns {void} The function `checkSelectedSourceKey` returns either a string or an array of strings.
    */
   private checkSelectedSourceKey;
+  /**
+   * Normalizes the selectedSourceKey value to match the shape expected by the current selectType.
+   * Ensures that switching selectType at runtime (e.g. single → multiple) coerces the stored key
+   * into the correct type (array for multiple, string for single, empty string for none).
+   *
+   * @param {string | string[]} key - The current selectedSourceKey value to normalize.
+   * @returns {string | string[]} The normalized key matching the current selectType shape.
+   */
+  private normalizeSelectedSourceKeyBySelectType;
   /**
    * The function checks if multiple selected keys exist and removes invalid keys, returning the valid
    * keys.

package/dist/types/components/vega-dropdown/slimmers/controllers/vega-dropdown-source-controller.d.ts

@@ -9,6 +9,7 @@ export declare class VegaDropdownSourceController extends VegaSlimmer {
   sourceForRender: VegaDropdown['sourceForRender'];
   searchController: VegaDropdown['searchController'];
   renderModeController: VegaDropdown['renderModeController'];
+  selectAllController: VegaDropdown['selectAllController'];
   /**
    * Component lifecycle - [componentWillLoad]
    */
@@ -19,6 +20,10 @@ export declare class VegaDropdownSourceController extends VegaSlimmer {
   watchSource(): void;
   /** watchCaseSensitive */
   watchCaseSensitive(): void;
+  /**
+   * Watch allowSelectAll property changes
+   */
+  watchAllowSelectAll(): void;
   /**
    * The function sets the source for rendering by searching for a formatted source.
    */

package/dist/types/components/vega-dropdown/slimmers/renderers/vega-dropdown-list-renderer.d.ts

@@ -15,6 +15,8 @@ export declare class VegaDropdownListRenderer extends VegaSlimmer {
   scrollableController: VegaDropdown['scrollableController'];
   translationSlimmer: VegaDropdown['translationSlimmer'];
   virtualizationThreshold: VegaDropdown['virtualizationThreshold'];
+  allowSelectAll: VegaDropdown['allowSelectAll'];
+  selectAllController: VegaDropdown['selectAllController'];
   private virtualScrollRef;
   private templateContainerRef;
   private defaultMaxHeightOfItemsContainer;

package/dist/types/components/vega-dropdown/types.d.ts

@@ -1,3 +1,11 @@
+/**
+ * Detail payload emitted by `vegaDropdownSelectAllClick` / `dropdownSelectAllClick`.
+ *
+ * `true` means all selectable items are now selected.
+ * `false` means Select All has been cleared.
+ */
+export type VegaDropdownSelectAllClickEventDetail = boolean;
+
 /**
  * Configuration for a single dropdown item.
  */

package/dist/types/components/vega-dropdown/vega-dropdown-item/slimmers/controllers/vega-dropdown-item-state-controller.d.ts

@@ -8,8 +8,33 @@ export declare class VegaDropdownItemStateController extends SubStateObserverSli
   selectType: VegaDropdownItem['selectType'];
   itemKey: VegaDropdownItem['itemKey'];
   selected: VegaDropdownItem['selected'];
+  indeterminate: VegaDropdownItem['indeterminate'];
   prefixIconSlot: VegaDropdownItem['prefixIconSlot'];
   itemDisplayRule: VegaDropdownItem['itemDisplayRule'];
   itemTooltipProps: VegaDropdownItem['itemTooltipProps'];
+  private readonly selectAllKey;
+  /**
+   * Initializes the dropdown item state controller with parent state observer setup
+   */
   constructor();
+  /**
+   * Gets the source of the parent dropdown, with fallback logic for different rendering modes
+   *
+   * @returns {VegaDropdown['source']} The source array from parent dropdown or content-box parent ref
+   */
+  private getParentDropdownSource;
+  /**
+   * Gets the parent dropdown element for the current item.
+   * Supports both direct template ancestry and content-box appender fallback.
+   *
+   * @returns {Nullable<HTMLVegaDropdownElement>} The parent dropdown element when found, otherwise null/undefined
+   */
+  private getParentDropdown;
+  /**
+   * Determines if the select-all checkbox should display in indeterminate state
+   *
+   * @param {VegaDropdown['selectedSourceKey']} selectedSourceKey - The currently selected keys
+   * @returns {boolean} True if this is a select-all item with some but not all items selected
+   */
+  private isSelectAllIndeterminate;
 }

package/dist/types/components/vega-dropdown/vega-dropdown-item/slimmers/renderers/vega-dropdown-item-renderer.d.ts

@@ -8,6 +8,7 @@ export declare class VegaDropdownItemRenderer extends VegaSlimmer {
   prefixIconSlot: VegaDropdownItem['prefixIconSlot'];
   disabled: VegaDropdownItem['disabled'];
   selected: VegaDropdownItem['selected'];
+  indeterminate: VegaDropdownItem['indeterminate'];
   selectType: VegaDropdownItem['selectType'];
   height: VegaDropdownItem['height'];
   itemDisplayRule: VegaDropdownItem['itemDisplayRule'];

package/dist/types/components/vega-dropdown/vega-dropdown-item/vega-dropdown-item.d.ts

@@ -32,6 +32,10 @@ export declare class VegaDropdownItem {
    * Specifies the dropdown item's selected status.
    */
   selected: boolean;
+  /**
+   * Specifies whether the dropdown item checkbox should show indeterminate state.
+   */
+  indeterminate: boolean;
   /**
    * Specifies the dropdown item's rule of display.
    */

package/dist/types/components/vega-dropdown/vega-dropdown.d.ts

@@ -24,6 +24,7 @@ import { VegaDropdownScrollableController } from './slimmers/controllers/vega-dr
 import { VegaDropdownRemoteInvocationController } from './slimmers/controllers/vega-dropdown-remote-invocation-controller';
 import { TranslationSlimmer } from '../../helpers/slimmers/translation';
 import { VegaDropdownResetRenderer } from './slimmers/renderers/vega-dropdown-reset-renderer';
+import { VegaDropdownSelectAllController } from './slimmers/controllers/vega-dropdown-select-all-controller';
 /**
  * @vegaVersion 1.3.0
  */
@@ -41,6 +42,7 @@ export declare class VegaDropdown {
   protected readonly keyboardController: VegaDropdownKeyboardController;
   protected readonly appenderController: VegaDropdownAppenderController;
   protected readonly searchController: VegaDropdownSearchController;
+  protected readonly selectAllController: VegaDropdownSelectAllController;
   /**
    * childrenController should be defined before selectedController,
    *     which can ensure collecting information before verifying it.
@@ -58,6 +60,7 @@ export declare class VegaDropdown {
   protected showEventEmitter: EventEmitSlimmerBase;
   protected hideEventEmitter: EventEmitSlimmerBase;
   protected dropdownClickEventEmitter: EventEmitSlimmerBase;
+  protected selectAllClickEventEmitter: EventEmitSlimmerBase;
   protected resetEventEmitter: EventEmitSlimmerBase;
   protected createEventEmitter: EventEmitSlimmerBase;
   protected searchEventEmitter: EventEmitSlimmerBase;
@@ -311,6 +314,15 @@ export declare class VegaDropdown {
    * @vegaVersion 2.74.0
    */
   searchNoResultsText: string;
+  /**
+   * Allows users to select or deselect all items in the dropdown.
+   *    Only applicable when selectType is set to 'multiple'.
+   *    When enabled, a "Select All" option is added to the dropdown menu.
+   *
+   * @vegaVersion 2.93.0
+   */
+  allowSelectAll: boolean;
+  watchAllowSelectAll(): void;
   /**
    * An event emitter notifying that a dropdown item has been clicked.
    *
@@ -327,6 +339,24 @@ export declare class VegaDropdown {
    * @vegaVersion 2.0.0
    */
   dropdownClick: EventEmitter<string>;
+  /**
+   * An event emitter notifying that the Select All option has been clicked.
+   *
+   * The event's `detail` property is `true` when all items become selected,
+   * and `false` when Select All is cleared.
+   *
+   * @vegaVersion 2.93.0
+   */
+  vegaDropdownSelectAllClick: EventEmitter<boolean>;
+  /**
+   * An event emitter notifying that the Select All option has been clicked.
+   *
+   * The event's `detail` property is `true` when all items become selected,
+   * and `false` when Select All is cleared.
+   * @eventSemantics namespace:native
+   * @vegaVersion 2.93.0
+   */
+  dropdownSelectAllClick: EventEmitter<boolean>;
   /**
    * An event emitter notifying that the dropdown has been displayed,
    *    either programmatically or via user interaction.
@@ -472,5 +502,23 @@ export declare class VegaDropdown {
    * @vegaVersion 1.47.0
    */
   setSelection(keys: string[] | string): Promise<void>;
+  /**
+   * Invoke this method to manually sync template/slot-based dropdown data.
+   * Useful when template items are dynamically added or removed.
+   *
+   * @example
+   * const dropdown = document.querySelector("vega-dropdown");
+   * const itemsContainer = dropdown.querySelector('[slot="items"]');
+   *
+   * const item = document.createElement('vega-dropdown-item');
+   * item.itemKey = 'new-item';
+   * item.label = 'New item';
+   * itemsContainer.appendChild(item);
+   *
+   * await dropdown.syncTemplateData();
+   *
+   * @vegaVersion 2.93.0
+   */
+  syncTemplateData(): Promise<void>;
   render(): VegaDropdown;
 }

package/dist/types/components/vega-modal/slimmers/renderers/vega-modal-renderer.d.ts

@@ -12,6 +12,7 @@ export declare class VegaModalRenderer extends VegaSlimmer {
   margin: VegaModal['margin'];
   size: VegaModal['size'];
   height: VegaModal['height'];
+  corners: VegaModal['corners'];
   showCloseButton: VegaModal['showCloseButton'];
   modalTitle: VegaModal['modalTitle'];
   contentMaxHeight: VegaModal['contentMaxHeight'];
@@ -25,7 +26,7 @@ export declare class VegaModalRenderer extends VegaSlimmer {
   private modalContainer;
   getModalContentRef(): HTMLElement | null;
   getModalFooterRef(): HTMLElement | null;
-  getModalContainerRef(): HTMLElement | null;
+  getModalContainerRef(): HTMLVegaBoxElement | null;
   render(): VegaModal;
   private renderContainer;
   private renderHeader;

package/dist/types/components/vega-modal/vega-modal.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from '../../stencil-public-runtime';
-import { MarginType, PaddingType, ResponsiveType, SizeType } from '../../types/ui.type';
+import { CornersType, MarginType, PaddingType, ResponsiveType, SizeType } from '../../types/ui.type';
 import { BreakpointsTokenType } from '../../types/design-token.type';
 import { VegaModalBackdrop, VegaModalBackdropColor, VegaModalSectionPadding } from './types';
 import { GlobalSlimmers } from '../../vega-slimmer/vega-slimmer-core';
@@ -175,6 +175,14 @@ export declare class VegaModal {
    */
   contentMaxHeight: ResponsiveType<number | string>;
   watchContentMaxHeight(): void;
+  /**
+   * Defines the corner of the modal dialog.
+   *    It accepts a string value representing a valid
+   *    border radius token.
+   *
+   * @vegaVersion 2.93.0
+   */
+  corners: ResponsiveType<CornersType>;
   /**
    * Provides a callback function that is triggered when a user clicks the
    *    close button located in the top right corner of the modal.

package/dist/types/components/vega-nav/vega-left-nav/slimmers/controllers/vega-left-nav-auto-collapse-controller.d.ts

@@ -5,7 +5,6 @@ export declare class VegaLeftNavAutoCollapseController extends VegaSlimmer {
   openState: VegaLeftNav['openState'];
   autoCollapseOnOverlay: VegaLeftNav['autoCollapseOnOverlay'];
   showAsOverlay: VegaLeftNav['showAsOverlay'];
-  backdropController: VegaLeftNav['backdropController'];
   openStateController: VegaLeftNav['openStateController'];
   registerMenuClickObserver(): void;
   unregisterMenuClickObserver(): void;

package/dist/types/components/vega-nav/vega-left-nav/slimmers/controllers/vega-left-nav-backdrop-controller.d.ts

@@ -1,28 +1,21 @@
 import { VegaLeftNav } from '../../vega-left-nav';
-import { LeftNavOpenStateType } from '../../../interface';
-import { PageResizeObserverSlimmer } from '../../../../../helpers/slimmers/page-resize-observer-slimmer';
-import { Nullable } from '../../../../../types/general';
-export declare class VegaLeftNavBackdropController extends PageResizeObserverSlimmer {
-  openState: VegaLeftNav['openState'];
-  showAsOverlay: VegaLeftNav['showAsOverlay'];
+import { VegaLeftNavBackdropManager } from './vega-left-nav-backdrop-manager';
+/**
+ * Backdrop click handler controller for left-nav.
+ * Manages backdrop interaction (click events) while the VegaLeftNavBackdropManager
+ * handles visibility state through its slimmer watch methods.
+ */
+export declare class VegaLeftNavBackdropController {
   openStateController: VegaLeftNav['openStateController'];
-  private backdrop;
+  backdropManager: VegaLeftNavBackdropManager;
   connectedCallback(): void;
   disconnectedCallback(): void;
+  private readonly handleBackdropClick;
   /**
-   * The below method is e2e-test covered in
-   * @see{module:vega-left-nav-e2e-resize-with-desktop}
-   */
-  constructor();
-  watchOpenState(newState: LeftNavOpenStateType): void;
-  watchShowAsOverlay(): void;
-  getBackdrop(): Nullable<HTMLElement>;
-  shouldShowBackdrop(): boolean;
-  /**
+   * Attach backdrop click event listener.
    * The below method is e2e-test covered in
    * @see{module:vega-left-nav-e2e-vega-click-backdrop}
    */
-  private createBackdrop;
-  private updateBackdropUI;
-  private isLargeScreen;
+  private attachBackdropClickEvent;
+  private detachBackdropClickEvent;
 }

package/dist/types/components/vega-nav/vega-left-nav/slimmers/controllers/vega-left-nav-backdrop-manager.d.ts

@@ -0,0 +1,41 @@
+import { VegaLeftNav } from '../../vega-left-nav';
+import { LeftNavOpenStateType } from '../../../interface';
+import { SharedBackdropManager } from '../../../../../helpers/backdrop';
+/**
+ * Left-nav specific backdrop manager — extends SharedBackdropManager to get its own static scope.
+ * Each subclass of SharedBackdropManager gets its own separate static state (consumers, visibility intents, etc).
+ */
+export declare class VegaLeftNavBackdropManager extends SharedBackdropManager {
+  static readonly backdropClassName: string;
+  openState: VegaLeftNav['openState'];
+  showAsOverlay: VegaLeftNav['showAsOverlay'];
+  /**
+   * Watch openState changes and update visibility intent.
+   *
+   * @param {LeftNavOpenStateType} newState - The new open state.
+   */
+  watchOpenState(newState: LeftNavOpenStateType): void;
+  /**
+   * Watch showAsOverlay changes and re-evaluate visibility.
+   */
+  watchShowAsOverlay(): void;
+  /**
+   * Customize backdrop creation for left-nav use case.
+   *
+   * @param {Document} doc - The document reference.
+   * @returns {HTMLVegaBackdropElement} The created and configured backdrop element.
+   */
+  protected createBackdrop(doc: Document): HTMLVegaBackdropElement;
+  /**
+   * Determine if backdrop should be shown based on current state.
+   *
+   * @returns {boolean} True if backdrop should be visible.
+   */
+  private shouldShowBackdrop;
+  /**
+   * Check if current breakpoint is large screen.
+   *
+   * @returns {boolean} True if current breakpoint is 'L' or 'XL'.
+   */
+  private isLargeScreen;
+}

package/dist/types/components/vega-nav/vega-left-nav/slimmers/controllers/vega-left-nav-open-state-controller.d.ts

@@ -1,12 +1,14 @@
 import { VegaLeftNav } from '../../vega-left-nav';
 import { LeftNavOpenStateType } from '../../../interface';
 import { PageResizeObserverSlimmer } from '../../../../../helpers/slimmers/page-resize-observer-slimmer';
+import { VegaLeftNavBackdropManager } from './vega-left-nav-backdrop-manager';
 export declare class VegaLeftNavOpenStateController extends PageResizeObserverSlimmer {
   host: VegaLeftNav['host'];
   open: VegaLeftNav['open'];
   openState: VegaLeftNav['openState'];
   stateUpdateEventEmitter: VegaLeftNav['stateUpdateEventEmitter'];
-  backdropController: VegaLeftNav['backdropController'];
+  showAsOverlay: VegaLeftNav['showAsOverlay'];
+  backdropManager: VegaLeftNavBackdropManager;
   private isVoiceOverClick;
   private triggerElement;
   /**
@@ -49,4 +51,5 @@ export declare class VegaLeftNavOpenStateController extends PageResizeObserverSl
    * @see{module:vega-left-nav-e2e-resize-with-desktop}
    */
   private updateMainContentUI;
+  private shouldShowBackdrop;
 }

package/dist/types/components/vega-nav/vega-left-nav/slimmers/controllers/vega-left-nav-zindex-controller.d.ts

@@ -3,7 +3,7 @@ import { VegaLeftNav } from '../../vega-left-nav';
 export declare class VegaLeftNavZIndexController extends VegaSlimmer {
   host: VegaLeftNav['host'];
   openState: VegaLeftNav['openState'];
-  backdropController: VegaLeftNav['backdropController'];
+  backdropManager: VegaLeftNav['backdropManager'];
   watchOpenState(): void;
   /**
    * The below method is e2e-test covered in

package/dist/types/components/vega-nav/vega-left-nav/vega-left-nav.d.ts

@@ -5,6 +5,7 @@ import { VegaLeftNavOpenStateController } from './slimmers/controllers/vega-left
 import { VegaLeftNavHeaderRenderer } from './slimmers/renderers/vega-left-nav-header-renderer';
 import { VegaLeftNavFooterRenderer } from './slimmers/renderers/vega-left-nav-footer-renderer';
 import { VegaLeftNavZIndexController } from './slimmers/controllers/vega-left-nav-zindex-controller';
+import { VegaLeftNavBackdropManager } from './slimmers/controllers/vega-left-nav-backdrop-manager';
 import { VegaLeftNavBackdropController } from './slimmers/controllers/vega-left-nav-backdrop-controller';
 import { VegaNavListRenderer } from '../slimmers/renderers/vega-nav-list-renderer';
 import { EventEmitSlimmerBase } from '../../../helpers/event-manager/slimmers/event-emit-slimmer';
@@ -22,6 +23,7 @@ export declare class VegaLeftNav {
   protected readonly headerRenderer: VegaLeftNavHeaderRenderer;
   protected readonly footerRenderer: VegaLeftNavFooterRenderer;
   protected readonly openStateController: VegaLeftNavOpenStateController;
+  protected readonly backdropManager: VegaLeftNavBackdropManager;
   protected readonly backdropController: VegaLeftNavBackdropController;
   protected readonly zIndexController: VegaLeftNavZIndexController;
   protected readonly listRenderer: VegaNavListRenderer;