igniteui-angular 22.0.0-rc.1 → 22.0.0

package/fesm2022/igniteui-angular-select.mjs

@@ -1,17 +1,16 @@
 import * as i4 from 'igniteui-angular/input-group';
 import { IGX_INPUT_GROUP_TYPE, IgxInputState, IgxInputGroupComponent, IgxInputDirective, IgxSuffixDirective, IgxReadOnlyInputDirective, IgxHintDirective, IgxPrefixDirective, IgxLabelDirective } from 'igniteui-angular/input-group';
 import * as i0 from '@angular/core';
-import { ChangeDetectionStrategy, Component, Input, Optional, Directive, inject, Injector, EventEmitter, QueryList, TemplateRef, ElementRef, booleanAttribute, ContentChild, Output, HostBinding, forwardRef, ViewChildren, ContentChildren, ViewChild, NgModule } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Input, Directive, inject, Injector, EventEmitter, QueryList, TemplateRef, ElementRef, booleanAttribute, ContentChild, Output, HostBinding, forwardRef, ViewChildren, ContentChildren, ViewChild, NgModule } from '@angular/core';
 import { IgxDropDownGroupComponent, IgxDropDownItemComponent, IgxDropDownItemNavigationDirective, IgxDropDownComponent, IGX_DROPDOWN_BASE } from 'igniteui-angular/drop-down';
 import { NgTemplateOutlet } from '@angular/common';
 import { NgControl, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { Subscription, timer, noop } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
-import { BaseFitPositionStrategy, VerticalAlignment, HorizontalAlignment, Util, IgxOverlayService, AbsoluteScrollStrategy } from 'igniteui-angular/core';
-import { __decorate, __param } from 'tslib';
-import { fadeOut, fadeIn } from 'igniteui-angular/animations';
+import { IgxOverlayService, AbsoluteScrollStrategy, AutoPositionStrategy, BaseFitPositionStrategy, VerticalAlignment, HorizontalAlignment, Util } from 'igniteui-angular/core';
 import { IgxToggleDirective } from 'igniteui-angular/directives';
 import { IgxIconComponent } from 'igniteui-angular/icon';
+import { fadeOut, fadeIn } from 'igniteui-angular/animations';
 
 /**
  * The `<igx-select-item>` is a container intended for row items in
@@ -92,197 +91,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImpor
                 type: Input
             }] } });
 
-/** @hidden @internal */
-let SelectPositioningStrategy = class SelectPositioningStrategy extends BaseFitPositionStrategy {
-    constructor(select, settings, platform) {
-        super();
-        this.select = select;
-        this.platform = platform;
-        this._selectDefaultSettings = {
-            horizontalDirection: HorizontalAlignment.Right,
-            verticalDirection: VerticalAlignment.Bottom,
-            horizontalStartPoint: HorizontalAlignment.Left,
-            verticalStartPoint: VerticalAlignment.Top,
-            openAnimation: fadeIn,
-            closeAnimation: fadeOut
-        };
-        // Global variables required for cases of !initialCall (page scroll/overlay repositionAll)
-        this.global_yOffset = 0;
-        this.global_xOffset = 0;
-        this.global_styles = {};
-        this.settings = Object.assign({}, this._selectDefaultSettings, settings);
-    }
-    /**
-     * Position the element based on the PositionStrategy implementing this interface.
-     *
-     * @param contentElement The HTML element to be positioned
-     * @param size Size of the element
-     * @param document reference to the Document object
-     * @param initialCall should be true if this is the initial call to the method
-     * @param target attaching target for the component to show
-     * ```typescript
-     * settings.positionStrategy.position(content, size, document, true);
-     * ```
-     */
-    position(contentElement, _size, document, initialCall, target) {
-        const targetElement = target;
-        const rects = super.calculateElementRectangles(contentElement, targetElement);
-        // selectFit obj, to be used for both cases of initialCall and !initialCall(page scroll/overlay repositionAll)
-        const selectFit = {
-            verticalOffset: this.global_yOffset,
-            horizontalOffset: this.global_xOffset,
-            targetRect: rects.targetRect,
-            contentElementRect: rects.elementRect,
-            styles: this.global_styles,
-            scrollContainer: this.select.scrollContainer,
-            scrollContainerRect: this.select.scrollContainer.getBoundingClientRect()
-        };
-        if (initialCall) {
-            this.select.scrollContainer.scrollTop = 0;
-            // Fill in the required selectFit object properties.
-            selectFit.viewPortRect = Util.getViewportRect(document);
-            selectFit.itemElement = this.getInteractionItemElement();
-            selectFit.itemRect = selectFit.itemElement.getBoundingClientRect();
-            // Calculate input and selected item elements style related variables
-            selectFit.styles = this.calculateStyles(selectFit, targetElement);
-            selectFit.scrollAmount = this.calculateScrollAmount(selectFit);
-            // Calculate how much to offset the overlay container.
-            this.calculateYoffset(selectFit);
-            this.calculateXoffset(selectFit);
-            super.updateViewPortFit(selectFit);
-            // container does not fit in viewPort and is out on Top or Bottom
-            if (selectFit.fitVertical.back < 0 || selectFit.fitVertical.forward < 0) {
-                this.fitInViewport(contentElement, selectFit);
-            }
-            // Calculate scrollTop independently of the dropdown, as we cover all `igsSelect` specific positioning and
-            // scrolling to selected item scenarios here.
-            this.select.scrollContainer.scrollTop = selectFit.scrollAmount;
-        }
-        this.setStyles(contentElement, selectFit);
-    }
-    /**
-     * Obtain the selected item if there is such one or otherwise use the first one
-     */
-    getInteractionItemElement() {
-        let itemElement;
-        if (this.select.selectedItem) {
-            itemElement = this.select.selectedItem.element.nativeElement;
-        }
-        else {
-            itemElement = this.select.getFirstItemElement();
-        }
-        return itemElement;
-    }
-    /**
-     * Position the items outer container so selected item text is positioned over input text and if header
-     * And/OR footer - both header/footer are visible
-     *
-     * @param selectFit selectFit to use for computation.
-     */
-    fitInViewport(_contentElement, selectFit) {
-        const footer = selectFit.scrollContainerRect.bottom - selectFit.contentElementRect.bottom;
-        const header = selectFit.scrollContainerRect.top - selectFit.contentElementRect.top;
-        const lastItemFitSize = selectFit.targetRect.bottom + selectFit.styles.itemTextToInputTextDiff - footer;
-        const firstItemFitSize = selectFit.targetRect.top - selectFit.styles.itemTextToInputTextDiff - header;
-        // out of viewPort on Top
-        if (selectFit.fitVertical.back < 0) {
-            const possibleScrollAmount = selectFit.scrollContainer.scrollHeight -
-                selectFit.scrollContainerRect.height - selectFit.scrollAmount;
-            if (possibleScrollAmount + selectFit.fitVertical.back > 0 && firstItemFitSize > selectFit.viewPortRect.top) {
-                selectFit.scrollAmount -= selectFit.fitVertical.back;
-                selectFit.verticalOffset -= selectFit.fitVertical.back;
-                this.global_yOffset = selectFit.verticalOffset;
-            }
-            else {
-                selectFit.verticalOffset = 0;
-                this.global_yOffset = 0;
-            }
-            // out of viewPort on Bottom
-        }
-        else if (selectFit.fitVertical.forward < 0) {
-            if (selectFit.scrollAmount + selectFit.fitVertical.forward > 0 && lastItemFitSize < selectFit.viewPortRect.bottom) {
-                selectFit.scrollAmount += selectFit.fitVertical.forward;
-                selectFit.verticalOffset += selectFit.fitVertical.forward;
-                this.global_yOffset = selectFit.verticalOffset;
-            }
-            else {
-                selectFit.verticalOffset = -selectFit.contentElementRect.height + selectFit.targetRect.height;
-                this.global_yOffset = selectFit.verticalOffset;
-            }
-        }
-    }
-    /**
-     * Sets element's style which effectively positions the provided element
-     *
-     * @param element Element to position
-     * @param selectFit selectFit to use for computation.
-     * @param initialCall should be true if this is the initial call to the position method calling setStyles
-     */
-    setStyles(contentElement, selectFit) {
-        super.setStyle(contentElement, selectFit.targetRect, selectFit.contentElementRect, selectFit);
-        contentElement.style.width = `${selectFit.styles.contentElementNewWidth}px`; // manage container based on paddings?
-        this.global_styles.contentElementNewWidth = selectFit.styles.contentElementNewWidth;
-    }
-    /**
-     * Calculate selected item scroll position.
-     */
-    calculateScrollAmount(selectFit) {
-        const itemElementRect = selectFit.itemRect;
-        const scrollContainer = selectFit.scrollContainer;
-        const scrollContainerRect = selectFit.scrollContainerRect;
-        const scrollDelta = scrollContainerRect.top - itemElementRect.top;
-        let scrollPosition = scrollContainer.scrollTop - scrollDelta;
-        const dropDownHeight = scrollContainer.clientHeight;
-        scrollPosition -= dropDownHeight / 2;
-        scrollPosition += itemElementRect.height / 2;
-        return Math.round(Math.min(Math.max(0, scrollPosition), scrollContainer.scrollHeight - scrollContainerRect.height));
-    }
-    /**
-     * Calculate the necessary input and selected item styles to be used for positioning item text over input text.
-     * Calculate & Set default items container width.
-     *
-     * @param selectFit selectFit to use for computation.
-     */
-    calculateStyles(selectFit, target) {
-        const styles = {};
-        const inputElementStyles = window.getComputedStyle(target);
-        const itemElementStyles = window.getComputedStyle(selectFit.itemElement);
-        const numericInputFontSize = parseFloat(inputElementStyles.fontSize);
-        const numericInputPaddingTop = parseFloat(inputElementStyles.paddingTop);
-        const numericInputPaddingBottom = parseFloat(inputElementStyles.paddingBottom);
-        const numericItemFontSize = parseFloat(itemElementStyles.fontSize);
-        const inputTextToInputTop = ((selectFit.targetRect.bottom - numericInputPaddingBottom)
-            - (selectFit.targetRect.top + numericInputPaddingTop) - numericInputFontSize) / 2;
-        const itemTextToItemTop = (selectFit.itemRect.height - numericItemFontSize) / 2;
-        styles.itemTextToInputTextDiff = Math.round(itemTextToItemTop - inputTextToInputTop - numericInputPaddingTop);
-        const numericLeftPadding = parseFloat(itemElementStyles.paddingLeft);
-        const numericTextIndent = parseFloat(itemElementStyles.textIndent);
-        styles.itemTextPadding = numericLeftPadding;
-        styles.itemTextIndent = numericTextIndent;
-        // 24 is the input's toggle ddl icon width
-        styles.contentElementNewWidth = selectFit.targetRect.width + 24 + numericLeftPadding * 2;
-        return styles;
-    }
-    /**
-     * Calculate how much to offset the overlay container for Y-axis.
-     */
-    calculateYoffset(selectFit) {
-        selectFit.verticalOffset = -(selectFit.itemRect.top - selectFit.contentElementRect.top +
-            selectFit.styles.itemTextToInputTextDiff - selectFit.scrollAmount);
-        this.global_yOffset = selectFit.verticalOffset;
-    }
-    /**
-     * Calculate how much to offset the overlay container for X-axis.
-     */
-    calculateXoffset(selectFit) {
-        selectFit.horizontalOffset = selectFit.styles.itemTextIndent - selectFit.styles.itemTextPadding;
-        this.global_xOffset = selectFit.horizontalOffset;
-    }
-};
-SelectPositioningStrategy = __decorate([
-    __param(2, Optional())
-], SelectPositioningStrategy);
-
 /** @hidden @internal */
 class IgxSelectItemNavigationDirective extends IgxDropDownItemNavigationDirective {
     constructor() {
@@ -602,13 +410,13 @@ class IgxSelectComponent extends IgxDropDownComponent {
     }
     /**
      * Sets how the select will be styled.
-     * The allowed values are `line`, `box` and `border`. The input-group default is `line`.
+     * The allowed values are `line`, `box` and `border`. Defaults to `box` if no input-group type is set.
      * ```html
-     * <igx-select [type]="'box'"></igx-select>
+     * <igx-select [type]="'border'"></igx-select>
      * ```
      */
     get type() {
-        return this._type || this._inputGroupType || 'line';
+        return this._type || this._inputGroupType || 'box';
     }
     set type(val) {
         this._type = val;
@@ -680,24 +488,17 @@ class IgxSelectComponent extends IgxDropDownComponent {
         if (!this.selectedItem) {
             this.navigateFirst();
         }
-        super.open(Object.assign({}, this._overlayDefaults, this.overlaySettings, overlaySettings));
+        super.open(this.getMergedOverlaySettings(overlaySettings));
     }
     inputGroupClick(event, overlaySettings) {
         const targetElement = event.target;
         if (this.hintElement && targetElement.contains(this.hintElement.nativeElement)) {
             return;
         }
-        this.toggle(Object.assign({}, this._overlayDefaults, this.overlaySettings, overlaySettings));
+        this.toggle(this.getMergedOverlaySettings(overlaySettings));
     }
     /** @hidden @internal */
     ngAfterContentInit() {
-        this._overlayDefaults = {
-            target: this.getEditElement(),
-            modal: false,
-            positionStrategy: new SelectPositioningStrategy(this),
-            scrollStrategy: new AbsoluteScrollStrategy(),
-            excludeFromOutsideClick: [this.inputGroup.element.nativeElement]
-        };
         const changes$ = this.children.changes.pipe(takeUntil(this.destroy$)).subscribe(() => {
             this.setSelection(this.items.find(x => x.value === this.value));
             this.cdr.detectChanges();
@@ -724,7 +525,7 @@ class IgxSelectComponent extends IgxDropDownComponent {
     /** @hidden @internal */
     onToggleContentAppended(event) {
         const info = this.overlayService.getOverlayById(event.id);
-        if (info?.settings?.positionStrategy instanceof SelectPositioningStrategy) {
+        if (info?.settings?.positionStrategy?.isItemOverlapPositioning) {
             return;
         }
         super.onToggleContentAppended(event);
@@ -774,6 +575,14 @@ class IgxSelectComponent extends IgxDropDownComponent {
             this.ngControl.statusChanges.pipe(takeUntil(this.destroy$)).subscribe(this.onStatusChanged.bind(this));
             this.manageRequiredAsterisk();
         }
+        const targetElement = this.inputGroup.element.nativeElement.querySelector('.igx-input-group__bundle');
+        this._overlayDefaults = {
+            target: targetElement,
+            modal: false,
+            positionStrategy: new AutoPositionStrategy(),
+            scrollStrategy: new AbsoluteScrollStrategy(),
+            excludeFromOutsideClick: [targetElement]
+        };
         this.cdr.detectChanges();
     }
     /** @hidden @internal */
@@ -847,6 +656,13 @@ class IgxSelectComponent extends IgxDropDownComponent {
         }
         this.cdr.markForCheck();
     }
+    getMergedOverlaySettings(overlaySettings) {
+        const merged = Object.assign({}, this._overlayDefaults, this.overlaySettings, overlaySettings);
+        if (merged.positionStrategy?.isItemOverlapPositioning) {
+            merged.target = this.getEditElement();
+        }
+        return merged;
+    }
     setSelection(item) {
         if (item && item.value !== undefined && item.value !== null) {
             this.selection.set(this.id, new Set([item]));
@@ -924,6 +740,198 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImpor
                 type: Input
             }] } });
 
+/**
+ * Positions the select dropdown so that the active item's text overlaps
+ * the value displayed in the select input box.
+ */
+class IgxSelectOverlapPositionStrategy extends BaseFitPositionStrategy {
+    constructor(select, settings) {
+        super();
+        this.select = select;
+        this._selectDefaultSettings = {
+            horizontalDirection: HorizontalAlignment.Right,
+            verticalDirection: VerticalAlignment.Bottom,
+            horizontalStartPoint: HorizontalAlignment.Left,
+            verticalStartPoint: VerticalAlignment.Top,
+            openAnimation: fadeIn,
+            closeAnimation: fadeOut
+        };
+        // Global variables required for cases of !initialCall (page scroll/overlay repositionAll)
+        this.global_yOffset = 0;
+        this.global_xOffset = 0;
+        this.global_styles = {};
+        /** @hidden @internal */
+        this.isItemOverlapPositioning = true;
+        this.settings = Object.assign({}, this._selectDefaultSettings, settings);
+    }
+    /**
+     * Position the element based on the PositionStrategy implementing this interface.
+     *
+     * @param contentElement The HTML element to be positioned
+     * @param size Size of the element
+     * @param document reference to the Document object
+     * @param initialCall should be true if this is the initial call to the method
+     * @param target attaching target for the component to show
+     * ```typescript
+     * settings.positionStrategy.position(content, size, document, true);
+     * ```
+     */
+    position(contentElement, _size, document, initialCall, target) {
+        const targetElement = target;
+        const rects = super.calculateElementRectangles(contentElement, targetElement);
+        // selectFit obj, to be used for both cases of initialCall and !initialCall(page scroll/overlay repositionAll)
+        const selectFit = {
+            verticalOffset: this.global_yOffset,
+            horizontalOffset: this.global_xOffset,
+            targetRect: rects.targetRect,
+            contentElementRect: rects.elementRect,
+            styles: this.global_styles,
+            scrollContainer: this.select.scrollContainer,
+            scrollContainerRect: this.select.scrollContainer.getBoundingClientRect()
+        };
+        if (initialCall) {
+            this.select.scrollContainer.scrollTop = 0;
+            // Fill in the required selectFit object properties.
+            selectFit.viewPortRect = Util.getViewportRect(document);
+            selectFit.itemElement = this.getInteractionItemElement();
+            selectFit.itemRect = selectFit.itemElement.getBoundingClientRect();
+            // Calculate input and selected item elements style related variables
+            selectFit.styles = this.calculateStyles(selectFit, targetElement);
+            selectFit.scrollAmount = this.calculateScrollAmount(selectFit);
+            // Calculate how much to offset the overlay container.
+            this.calculateYoffset(selectFit);
+            this.calculateXoffset(selectFit);
+            super.updateViewPortFit(selectFit);
+            // container does not fit in viewPort and is out on Top or Bottom
+            if (selectFit.fitVertical.back < 0 || selectFit.fitVertical.forward < 0) {
+                this.fitInViewport(contentElement, selectFit);
+            }
+            // Calculate scrollTop independently of the dropdown, as we cover all `igsSelect` specific positioning and
+            // scrolling to selected item scenarios here.
+            this.select.scrollContainer.scrollTop = selectFit.scrollAmount;
+        }
+        this.setStyles(contentElement, selectFit);
+    }
+    /**
+     * Obtain the selected item if there is such one or otherwise use the first one
+     */
+    getInteractionItemElement() {
+        let itemElement;
+        if (this.select.selectedItem) {
+            itemElement = this.select.selectedItem.element.nativeElement;
+        }
+        else {
+            itemElement = this.select.getFirstItemElement();
+        }
+        return itemElement;
+    }
+    /**
+     * Position the items outer container so selected item text is positioned over input text and if header
+     * And/OR footer - both header/footer are visible
+     *
+     * @param selectFit selectFit to use for computation.
+     */
+    fitInViewport(_contentElement, selectFit) {
+        const footer = selectFit.scrollContainerRect.bottom - selectFit.contentElementRect.bottom;
+        const header = selectFit.scrollContainerRect.top - selectFit.contentElementRect.top;
+        const lastItemFitSize = selectFit.targetRect.bottom + selectFit.styles.itemTextToInputTextDiff - footer;
+        const firstItemFitSize = selectFit.targetRect.top - selectFit.styles.itemTextToInputTextDiff - header;
+        // out of viewPort on Top
+        if (selectFit.fitVertical.back < 0) {
+            const possibleScrollAmount = selectFit.scrollContainer.scrollHeight -
+                selectFit.scrollContainerRect.height - selectFit.scrollAmount;
+            if (possibleScrollAmount + selectFit.fitVertical.back > 0 && firstItemFitSize > selectFit.viewPortRect.top) {
+                selectFit.scrollAmount -= selectFit.fitVertical.back;
+                selectFit.verticalOffset -= selectFit.fitVertical.back;
+                this.global_yOffset = selectFit.verticalOffset;
+            }
+            else {
+                selectFit.verticalOffset = 0;
+                this.global_yOffset = 0;
+            }
+            // out of viewPort on Bottom
+        }
+        else if (selectFit.fitVertical.forward < 0) {
+            if (selectFit.scrollAmount + selectFit.fitVertical.forward > 0 && lastItemFitSize < selectFit.viewPortRect.bottom) {
+                selectFit.scrollAmount += selectFit.fitVertical.forward;
+                selectFit.verticalOffset += selectFit.fitVertical.forward;
+                this.global_yOffset = selectFit.verticalOffset;
+            }
+            else {
+                selectFit.verticalOffset = -selectFit.contentElementRect.height + selectFit.targetRect.height;
+                this.global_yOffset = selectFit.verticalOffset;
+            }
+        }
+    }
+    /**
+     * Sets element's style which effectively positions the provided element
+     *
+     * @param element Element to position
+     * @param selectFit selectFit to use for computation.
+     * @param initialCall should be true if this is the initial call to the position method calling setStyles
+     */
+    setStyles(contentElement, selectFit) {
+        super.setStyle(contentElement, selectFit.targetRect, selectFit.contentElementRect, selectFit);
+        contentElement.style.width = `${selectFit.styles.contentElementNewWidth}px`; // manage container based on paddings?
+        this.global_styles.contentElementNewWidth = selectFit.styles.contentElementNewWidth;
+    }
+    /**
+     * Calculate selected item scroll position.
+     */
+    calculateScrollAmount(selectFit) {
+        const itemElementRect = selectFit.itemRect;
+        const scrollContainer = selectFit.scrollContainer;
+        const scrollContainerRect = selectFit.scrollContainerRect;
+        const scrollDelta = scrollContainerRect.top - itemElementRect.top;
+        let scrollPosition = scrollContainer.scrollTop - scrollDelta;
+        const dropDownHeight = scrollContainer.clientHeight;
+        scrollPosition -= dropDownHeight / 2;
+        scrollPosition += itemElementRect.height / 2;
+        return Math.round(Math.min(Math.max(0, scrollPosition), scrollContainer.scrollHeight - scrollContainerRect.height));
+    }
+    /**
+     * Calculate the necessary input and selected item styles to be used for positioning item text over input text.
+     * Calculate & Set default items container width.
+     *
+     * @param selectFit selectFit to use for computation.
+     */
+    calculateStyles(selectFit, target) {
+        const styles = {};
+        const inputElementStyles = window.getComputedStyle(target);
+        const itemElementStyles = window.getComputedStyle(selectFit.itemElement);
+        const numericInputFontSize = parseFloat(inputElementStyles.fontSize);
+        const numericInputPaddingTop = parseFloat(inputElementStyles.paddingTop);
+        const numericInputPaddingBottom = parseFloat(inputElementStyles.paddingBottom);
+        const numericItemFontSize = parseFloat(itemElementStyles.fontSize);
+        const inputTextToInputTop = ((selectFit.targetRect.bottom - numericInputPaddingBottom)
+            - (selectFit.targetRect.top + numericInputPaddingTop) - numericInputFontSize) / 2;
+        const itemTextToItemTop = (selectFit.itemRect.height - numericItemFontSize) / 2;
+        styles.itemTextToInputTextDiff = Math.round(itemTextToItemTop - inputTextToInputTop - numericInputPaddingTop);
+        const numericLeftPadding = parseFloat(itemElementStyles.paddingLeft);
+        const numericTextIndent = parseFloat(itemElementStyles.textIndent);
+        styles.itemTextPadding = numericLeftPadding;
+        styles.itemTextIndent = numericTextIndent;
+        // 24 is the input's toggle ddl icon width
+        styles.contentElementNewWidth = selectFit.targetRect.width + 24 + numericLeftPadding * 2;
+        return styles;
+    }
+    /**
+     * Calculate how much to offset the overlay container for Y-axis.
+     */
+    calculateYoffset(selectFit) {
+        selectFit.verticalOffset = -(selectFit.itemRect.top - selectFit.contentElementRect.top +
+            selectFit.styles.itemTextToInputTextDiff - selectFit.scrollAmount);
+        this.global_yOffset = selectFit.verticalOffset;
+    }
+    /**
+     * Calculate how much to offset the overlay container for X-axis.
+     */
+    calculateXoffset(selectFit) {
+        selectFit.horizontalOffset = selectFit.styles.itemTextIndent - selectFit.styles.itemTextPadding;
+        this.global_xOffset = selectFit.horizontalOffset;
+    }
+}
+
 /* NOTE: Select directives collection for ease-of-use import in standalone components scenario */
 const IGX_SELECT_DIRECTIVES = [
     IgxSelectComponent,
@@ -964,5 +972,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { IGX_SELECT_DIRECTIVES, IgxSelectComponent, IgxSelectFooterDirective, IgxSelectGroupComponent, IgxSelectHeaderDirective, IgxSelectItemComponent, IgxSelectModule, IgxSelectToggleIconDirective };
+export { IGX_SELECT_DIRECTIVES, IgxSelectComponent, IgxSelectFooterDirective, IgxSelectGroupComponent, IgxSelectHeaderDirective, IgxSelectItemComponent, IgxSelectModule, IgxSelectOverlapPositionStrategy, IgxSelectToggleIconDirective };
 //# sourceMappingURL=igniteui-angular-select.mjs.map