@aquera/nile-elements 1.2.8-beta-1.7 → 1.2.8-beta-1.9

package/dist/src/nile-auto-complete/portal-manager.js

@@ -0,0 +1,308 @@
+import { autoUpdate, computePosition, flip, offset, shift, size, platform } from '@floating-ui/dom';
+import { PortalUtils, PortalContentUtils, PortalEventUtils } from './portal-utils';
+export class AutoCompletePortalManager {
+    constructor(component) {
+        this.portalContainer = null;
+        this.originalMenuParent = null;
+        this.measuredMenuHeight = null;
+        this.clonedMenu = null;
+        this.cleanupAutoUpdate = null;
+        this.currentPlacement = 'bottom';
+        this.currentMiddlewareData = null;
+        this.component = component;
+    }
+    createPortalAppendContainer() {
+        const container = document.createElement('div');
+        container.style.position = 'absolute';
+        container.style.zIndex = '9999';
+        container.style.pointerEvents = 'none';
+        container.style.width = 'auto';
+        container.style.minWidth = 'auto';
+        container.className = 'nile-auto-complete-portal-append';
+        return container;
+    }
+    positionPortalAppend() {
+        if (!this.portalContainer || !this.component.dropdownElement)
+            return;
+        this.measureMenuHeight();
+        this.computeFloatingUIPosition();
+    }
+    measureMenuHeight() {
+        if (this.measuredMenuHeight || !this.portalContainer)
+            return;
+        this.portalContainer.style.position = 'absolute';
+        this.portalContainer.style.visibility = 'hidden';
+        this.portalContainer.style.top = '0px';
+        this.portalContainer.style.left = '0px';
+        this.portalContainer.offsetHeight;
+        this.measuredMenuHeight = this.portalContainer.offsetHeight;
+        this.portalContainer.style.visibility = '';
+    }
+    async computeFloatingUIPosition() {
+        if (!this.portalContainer)
+            return;
+        const referenceElement = this.component.inputElement || this.component;
+        const floatingElement = this.portalContainer;
+        try {
+            const { x, y, placement, middlewareData } = await this.calculateFloatingUIPosition(referenceElement, floatingElement);
+            this.applyFloatingUIPosition(floatingElement, referenceElement, x, y, placement, middlewareData);
+        }
+        catch (error) {
+            console.warn('Floating UI positioning failed, falling back to simple positioning:', error);
+            this.fallbackPositioning();
+        }
+    }
+    async calculateFloatingUIPosition(referenceElement, floatingElement) {
+        const boundary = PortalUtils.findBoundaryElements(referenceElement);
+        // Use 'bottom-start' or 'top-start' to align left edges for auto-width menu
+        const basePlacement = PortalUtils.getOptimalPlacement(referenceElement);
+        const initialPlacement = basePlacement === 'top' ? 'top-start' : 'bottom-start';
+        const middleware = this.createFloatingUIMiddleware(boundary);
+        return await computePosition(referenceElement, floatingElement, {
+            placement: initialPlacement,
+            strategy: 'fixed',
+            middleware,
+            platform: this.createCustomPlatform()
+        });
+    }
+    createFloatingUIMiddleware(boundary) {
+        return [
+            offset(4),
+            size({
+                apply: this.handleSizeMiddleware.bind(this),
+                padding: 10,
+                boundary: boundary
+            }),
+            flip({
+                fallbackPlacements: ['bottom-start', 'top-start', 'bottom', 'top', 'bottom-end', 'top-end'],
+                fallbackStrategy: 'bestFit',
+                padding: 10,
+                boundary: boundary
+            }),
+            shift({
+                padding: 10,
+                crossAxis: true,
+                boundary: boundary
+            })
+        ];
+    }
+    handleSizeMiddleware({ availableWidth, availableHeight, elements, rects }) {
+        const maxHeight = PortalUtils.calculateOptimalHeight(rects.reference, window.innerHeight, this.currentPlacement);
+        // elements.floating.style.maxWidth = `${availableWidth}px`;
+        elements.floating.style.maxHeight = `${maxHeight}px`;
+        elements.floating.style.setProperty('--auto-size-available-width', `${availableWidth}px`);
+        elements.floating.style.setProperty('--auto-size-available-height', `${maxHeight}px`);
+    }
+    createCustomPlatform() {
+        return platform;
+    }
+    applyFloatingUIPosition(floatingElement, referenceElement, x, y, placement, middlewareData) {
+        // For auto-complete, align left edge with input element
+        // Use reference element's left position, not Floating UI's x (which might shift)
+        const referenceRect = referenceElement.getBoundingClientRect();
+        Object.assign(floatingElement.style, {
+            left: `${referenceRect.left}px`,
+            top: `${y}px`,
+            position: 'fixed',
+            pointerEvents: 'auto',
+            width: 'auto',
+            minWidth: 'auto'
+        });
+        this.currentPlacement = placement;
+        this.currentMiddlewareData = middlewareData;
+        PortalUtils.applyCollisionData(floatingElement, middlewareData, placement);
+        const placementClass = placement.split('-')[0];
+        floatingElement.className = `nile-auto-complete-portal-append menu__listbox--${placementClass}`;
+    }
+    fallbackPositioning() {
+        if (!this.portalContainer)
+            return;
+        const referenceElement = this.component.inputElement || this.component;
+        const rect = referenceElement.getBoundingClientRect();
+        const viewportHeight = window.innerHeight;
+        const menuHeight = this.measuredMenuHeight || 200;
+        const spaceBelow = viewportHeight - rect.bottom;
+        const spaceAbove = rect.top;
+        let topPosition;
+        let placementClass;
+        let maxHeight;
+        if (spaceAbove > spaceBelow) {
+            maxHeight = Math.max(spaceAbove - 20, 100);
+            topPosition = Math.max(rect.top - maxHeight - 4, 10);
+            placementClass = 'top';
+        }
+        else {
+            maxHeight = Math.max(spaceBelow - 20, 100);
+            topPosition = rect.bottom + 4;
+            placementClass = 'bottom';
+        }
+        this.portalContainer.style.left = `${rect.left}px`;
+        this.portalContainer.style.top = `${topPosition}px`;
+        // Let the menu auto-size based on its content, don't force width to match input
+        this.portalContainer.style.width = 'auto';
+        this.portalContainer.style.minWidth = 'auto';
+        this.portalContainer.style.maxHeight = `${maxHeight}px`;
+        this.portalContainer.style.pointerEvents = 'auto';
+        this.portalContainer.className = `nile-auto-complete-portal-append menu__listbox--${placementClass}`;
+        this.calculateAndSetAutoSizeProperties(rect, topPosition, placementClass);
+    }
+    calculateAndSetAutoSizeProperties(rect, topPosition, placementClass) {
+        if (!this.portalContainer)
+            return;
+        const viewportHeight = window.innerHeight;
+        const viewportWidth = window.innerWidth;
+        let availableHeight;
+        if (placementClass === 'top') {
+            availableHeight = rect.top - 10;
+        }
+        else {
+            availableHeight = viewportHeight - rect.bottom - 10;
+        }
+        const availableWidth = Math.min(rect.width, viewportWidth - rect.left - 10);
+        this.portalContainer.style.setProperty('--auto-size-available-height', `${Math.max(availableHeight, 100)}px`);
+        this.portalContainer.style.setProperty('--auto-size-available-width', `${Math.max(availableWidth, 200)}px`);
+    }
+    updatePortalAppendPosition() {
+        if (this.component.portal && this.portalContainer) {
+            this.positionPortalAppend();
+        }
+    }
+    handleWindowResize() {
+        if (this.component.portal && this.portalContainer) {
+            this.positionPortalAppend();
+        }
+    }
+    setupAutoUpdatePositioning() {
+        if (!this.portalContainer || !this.component)
+            return;
+        this.cleanupAutoUpdatePositioning();
+        this.cleanupAutoUpdate = autoUpdate(this.component, this.portalContainer, () => {
+            this.computeFloatingUIPosition();
+        }, {
+            ancestorScroll: true,
+            ancestorResize: true,
+            elementResize: true,
+            layoutShift: true,
+            animationFrame: true
+        });
+    }
+    cleanupAutoUpdatePositioning() {
+        if (this.cleanupAutoUpdate) {
+            this.cleanupAutoUpdate();
+            this.cleanupAutoUpdate = null;
+        }
+    }
+    injectStylesToDocument() {
+        if (!this.portalContainer)
+            return;
+        const styleId = PortalUtils.generateStyleId();
+        if (document.getElementById(styleId))
+            return;
+        const componentStyles = this.component.constructor.styles;
+        if (!componentStyles)
+            return;
+        const styleElement = document.createElement('style');
+        styleElement.id = styleId;
+        styleElement.textContent = PortalUtils.extractStylesAsCSS(componentStyles);
+        document.head.appendChild(styleElement);
+        this.portalContainer.__injectedStyleId = styleId;
+    }
+    adoptStylesToPortalAppend() {
+        if (!this.portalContainer)
+            return;
+        this.injectStylesToDocument();
+    }
+    setupPortalAppend() {
+        if (!this.component.portal)
+            return;
+        this.component.updateComplete.then(() => {
+            setTimeout(() => {
+                // Try to find menu in shadow root first, then fallback to querySelector
+                const menu = this.component.shadowRoot?.querySelector('#content-menu') ||
+                    this.component.querySelector('#content-menu');
+                if (menu && this.component.isDropdownOpen) {
+                    this.originalMenuParent = menu.parentElement;
+                    this.clonedMenu = this.createPortalMenu();
+                    this.portalContainer = this.createPortalAppendContainer();
+                    this.portalContainer.appendChild(this.clonedMenu);
+                    document.body.appendChild(this.portalContainer);
+                    this.adoptStylesToPortalAppend();
+                    this.clonedMenu.style.display = '';
+                    this.positionPortalAppend();
+                    this.setupPortalEventListeners();
+                    this.setupAutoUpdatePositioning();
+                    window.addEventListener('resize', this.handleWindowResize.bind(this));
+                }
+            }, 10);
+        });
+    }
+    createPortalMenu() {
+        return PortalContentUtils.createPortalMenu(this.component);
+    }
+    setupPortalEventListeners() {
+        PortalEventUtils.setupPortalEventListeners(this.clonedMenu, this.component);
+    }
+    cleanupPortalAppend() {
+        this.cleanupAutoUpdatePositioning();
+        if (this.portalContainer && this.portalContainer.parentNode) {
+            const injectedStyleId = this.portalContainer.__injectedStyleId;
+            if (injectedStyleId) {
+                const styleElement = document.getElementById(injectedStyleId);
+                if (styleElement) {
+                    styleElement.remove();
+                }
+            }
+            this.portalContainer.parentNode.removeChild(this.portalContainer);
+        }
+        window.removeEventListener('resize', this.handleWindowResize.bind(this));
+        this.portalContainer = null;
+        this.originalMenuParent = null;
+        this.clonedMenu = null;
+        this.measuredMenuHeight = null;
+        this.currentPlacement = 'bottom';
+        this.currentMiddlewareData = null;
+    }
+    get portalContainerElement() {
+        return this.portalContainer;
+    }
+    resetMeasuredHeight() {
+        this.measuredMenuHeight = null;
+    }
+    updatePortalOptions() {
+        if (this.portalContainer && this.clonedMenu) {
+            PortalContentUtils.updatePortalMenuItems(this.clonedMenu, this.component);
+            this.forceReposition();
+        }
+    }
+    forceReposition() {
+        if (this.portalContainer) {
+            this.computeFloatingUIPosition();
+        }
+    }
+    getCurrentPlacement() {
+        return this.currentPlacement;
+    }
+    getCurrentMiddlewareData() {
+        return this.currentMiddlewareData;
+    }
+    isUsingFloatingUI() {
+        return this.cleanupAutoUpdate !== null;
+    }
+    isPositioningOptimal() {
+        if (!this.portalContainer || !this.currentMiddlewareData)
+            return true;
+        const referenceElement = this.component.inputElement || this.component;
+        const rect = referenceElement.getBoundingClientRect();
+        const viewportHeight = window.innerHeight;
+        const spaceBelow = viewportHeight - rect.bottom;
+        const spaceAbove = rect.top;
+        const isAbove = this.currentPlacement.startsWith('top');
+        const isBelow = this.currentPlacement.startsWith('bottom');
+        if (isAbove && spaceBelow > spaceAbove)
+            return false;
+        if (isBelow && spaceAbove > spaceBelow)
+            return false;
+        return true;
+    }
+}
+//# sourceMappingURL=portal-manager.js.map

package/dist/src/nile-auto-complete/portal-manager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal-manager.js","sourceRoot":"","sources":["../../../src/nile-auto-complete/portal-manager.ts"],"names":[],"mappings":"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","sourcesContent":["import { \n  autoUpdate, \n  computePosition, \n  flip, \n  offset, \n  shift, \n  size, \n  platform,\n  type Placement,\n  type MiddlewareData,\n  type ComputePositionConfig\n} from '@floating-ui/dom';\nimport { PortalUtils, PortalContentUtils, PortalEventUtils } from './portal-utils';\n\nexport class AutoCompletePortalManager {\n  private portalContainer: HTMLElement | null = null;\n  private originalMenuParent: HTMLElement | null = null;\n  private measuredMenuHeight: number | null = null;\n  private component: any;\n  private clonedMenu: HTMLElement | null = null;\n  private cleanupAutoUpdate: (() => void) | null = null;\n  private currentPlacement: Placement = 'bottom';\n  private currentMiddlewareData: MiddlewareData | null = null;\n\n  constructor(component: any) {\n    this.component = component;\n  }\n\n  private createPortalAppendContainer(): HTMLElement {\n    const container = document.createElement('div');\n    container.style.position = 'absolute';\n    container.style.zIndex = '9999';\n    container.style.pointerEvents = 'none';\n    container.style.width = 'auto';\n    container.style.minWidth = 'auto';\n    container.className = 'nile-auto-complete-portal-append';\n    return container;\n  }\n\n  positionPortalAppend(): void {\n    if (!this.portalContainer || !this.component.dropdownElement) return;\n\n    this.measureMenuHeight();\n    this.computeFloatingUIPosition();\n  }\n\n  private measureMenuHeight(): void {\n    if (this.measuredMenuHeight || !this.portalContainer) return;\n\n    this.portalContainer.style.position = 'absolute';\n    this.portalContainer.style.visibility = 'hidden';\n    this.portalContainer.style.top = '0px';\n    this.portalContainer.style.left = '0px';\n    \n    this.portalContainer.offsetHeight;\n    \n    this.measuredMenuHeight = this.portalContainer.offsetHeight;\n    \n    this.portalContainer.style.visibility = '';\n  }\n\n  private async computeFloatingUIPosition(): Promise<void> {\n    if (!this.portalContainer) return;\n\n    const referenceElement = this.component.inputElement || this.component;\n    const floatingElement = this.portalContainer;\n\n    try {\n      const { x, y, placement, middlewareData } = await this.calculateFloatingUIPosition(\n        referenceElement,\n        floatingElement\n      );\n\n      this.applyFloatingUIPosition(floatingElement, referenceElement, x, y, placement, middlewareData);\n\n    } catch (error) {\n      console.warn('Floating UI positioning failed, falling back to simple positioning:', error);\n      this.fallbackPositioning();\n    }\n  }\n\n  private async calculateFloatingUIPosition(\n    referenceElement: HTMLElement,\n    floatingElement: HTMLElement\n  ): Promise<{ x: number; y: number; placement: Placement; middlewareData: MiddlewareData }> {\n    const boundary = PortalUtils.findBoundaryElements(referenceElement);\n    // Use 'bottom-start' or 'top-start' to align left edges for auto-width menu\n    const basePlacement = PortalUtils.getOptimalPlacement(referenceElement);\n    const initialPlacement = basePlacement === 'top' ? 'top-start' : 'bottom-start';\n    const middleware = this.createFloatingUIMiddleware(boundary);\n\n    return await computePosition(referenceElement, floatingElement, {\n      placement: initialPlacement,\n      strategy: 'fixed',\n      middleware,\n      platform: this.createCustomPlatform()\n    });\n  }\n\n  private createFloatingUIMiddleware(boundary: Element[] | undefined): ComputePositionConfig['middleware'] {\n    return [\n      offset(4),\n      size({\n        apply: this.handleSizeMiddleware.bind(this),\n        padding: 10,\n        boundary: boundary\n      }),\n      flip({\n        fallbackPlacements: ['bottom-start', 'top-start', 'bottom', 'top', 'bottom-end', 'top-end'],\n        fallbackStrategy: 'bestFit',\n        padding: 10,\n        boundary: boundary\n      }),\n      shift({\n        padding: 10,\n        crossAxis: true,\n        boundary: boundary\n      })\n    ];\n  }\n\n  private handleSizeMiddleware({ availableWidth, availableHeight, elements, rects }: {\n    availableWidth: number;\n    availableHeight: number;\n    elements: { floating: HTMLElement };\n    rects: { reference: { x: number; y: number; width: number; height: number } };\n  }): void {\n    const maxHeight = PortalUtils.calculateOptimalHeight(\n      rects.reference,\n      window.innerHeight,\n      this.currentPlacement\n    );\n\n    // elements.floating.style.maxWidth = `${availableWidth}px`;\n    elements.floating.style.maxHeight = `${maxHeight}px`;\n    \n    elements.floating.style.setProperty('--auto-size-available-width', `${availableWidth}px`);\n    elements.floating.style.setProperty('--auto-size-available-height', `${maxHeight}px`);\n  }\n\n  private createCustomPlatform() {\n    return platform;\n  }\n\n  private applyFloatingUIPosition(\n    floatingElement: HTMLElement,\n    referenceElement: HTMLElement,\n    x: number,\n    y: number,\n    placement: Placement,\n    middlewareData: MiddlewareData\n  ): void {\n    // For auto-complete, align left edge with input element\n    // Use reference element's left position, not Floating UI's x (which might shift)\n    const referenceRect = referenceElement.getBoundingClientRect();\n    \n    Object.assign(floatingElement.style, {\n      left: `${referenceRect.left}px`,\n      top: `${y}px`,\n      position: 'fixed',\n      pointerEvents: 'auto',\n      width: 'auto',\n      minWidth: 'auto'\n    });\n\n    this.currentPlacement = placement;\n    this.currentMiddlewareData = middlewareData;\n    \n    PortalUtils.applyCollisionData(floatingElement, middlewareData, placement);\n    \n    const placementClass = placement.split('-')[0];\n    floatingElement.className = `nile-auto-complete-portal-append menu__listbox--${placementClass}`;\n  }\n\n  private fallbackPositioning(): void {\n    if (!this.portalContainer) return;\n\n    const referenceElement = this.component.inputElement || this.component;\n    const rect = referenceElement.getBoundingClientRect();\n    const viewportHeight = window.innerHeight;\n    const menuHeight = this.measuredMenuHeight || 200;\n    \n    const spaceBelow = viewportHeight - rect.bottom;\n    const spaceAbove = rect.top;\n    \n    let topPosition: number;\n    let placementClass: string;\n    let maxHeight: number;\n    \n    if (spaceAbove > spaceBelow) {\n      maxHeight = Math.max(spaceAbove - 20, 100);\n      topPosition = Math.max(rect.top - maxHeight - 4, 10);\n      placementClass = 'top';\n    } else {\n      maxHeight = Math.max(spaceBelow - 20, 100);\n      topPosition = rect.bottom + 4;\n      placementClass = 'bottom';\n    }\n\n    this.portalContainer.style.left = `${rect.left}px`;\n    this.portalContainer.style.top = `${topPosition}px`;\n    // Let the menu auto-size based on its content, don't force width to match input\n    this.portalContainer.style.width = 'auto';\n    this.portalContainer.style.minWidth = 'auto';\n    this.portalContainer.style.maxHeight = `${maxHeight}px`;\n    this.portalContainer.style.pointerEvents = 'auto';\n    this.portalContainer.className = `nile-auto-complete-portal-append menu__listbox--${placementClass}`;\n    \n    this.calculateAndSetAutoSizeProperties(rect, topPosition, placementClass);\n  }\n\n  private calculateAndSetAutoSizeProperties(rect: DOMRect, topPosition: number, placementClass: string): void {\n    if (!this.portalContainer) return;\n\n    const viewportHeight = window.innerHeight;\n    const viewportWidth = window.innerWidth;\n    \n    let availableHeight: number;\n    if (placementClass === 'top') {\n      availableHeight = rect.top - 10;\n    } else {\n      availableHeight = viewportHeight - rect.bottom - 10;\n    }\n    \n    const availableWidth = Math.min(rect.width, viewportWidth - rect.left - 10);\n    \n    this.portalContainer.style.setProperty('--auto-size-available-height', `${Math.max(availableHeight, 100)}px`);\n    this.portalContainer.style.setProperty('--auto-size-available-width', `${Math.max(availableWidth, 200)}px`);\n  }\n\n  updatePortalAppendPosition(): void {\n    if (this.component.portal && this.portalContainer) {\n      this.positionPortalAppend();\n    }\n  }\n\n  handleWindowResize(): void {\n    if (this.component.portal && this.portalContainer) {\n      this.positionPortalAppend();\n    }\n  }\n\n  private setupAutoUpdatePositioning(): void {\n    if (!this.portalContainer || !this.component) return;\n\n    this.cleanupAutoUpdatePositioning();\n\n    this.cleanupAutoUpdate = autoUpdate(\n      this.component,\n      this.portalContainer,\n      () => {\n        this.computeFloatingUIPosition();\n      },\n      {\n        ancestorScroll: true,\n        ancestorResize: true,\n        elementResize: true,\n        layoutShift: true,\n        animationFrame: true\n      }\n    );\n  }\n\n  private cleanupAutoUpdatePositioning(): void {\n    if (this.cleanupAutoUpdate) {\n      this.cleanupAutoUpdate();\n      this.cleanupAutoUpdate = null;\n    }\n  }\n\n  private injectStylesToDocument(): void {\n    if (!this.portalContainer) return;\n\n    const styleId = PortalUtils.generateStyleId();\n    \n    if (document.getElementById(styleId)) return;\n\n    const componentStyles = (this.component.constructor as any).styles;\n    if (!componentStyles) return;\n\n    const styleElement = document.createElement('style');\n    styleElement.id = styleId;\n    styleElement.textContent = PortalUtils.extractStylesAsCSS(componentStyles);\n    \n    document.head.appendChild(styleElement);\n    \n    (this.portalContainer as any).__injectedStyleId = styleId;\n  }\n\n  private adoptStylesToPortalAppend(): void {\n    if (!this.portalContainer) return;\n    this.injectStylesToDocument();\n  }\n\n  setupPortalAppend(): void {\n    if (!this.component.portal) return;\n\n    this.component.updateComplete.then(() => {\n      setTimeout(() => {\n        // Try to find menu in shadow root first, then fallback to querySelector\n        const menu = this.component.shadowRoot?.querySelector('#content-menu') as HTMLElement ||\n                     this.component.querySelector('#content-menu') as HTMLElement;\n        if (menu && this.component.isDropdownOpen) {\n          this.originalMenuParent = menu.parentElement as HTMLElement;\n          \n          this.clonedMenu = this.createPortalMenu();\n          \n          this.portalContainer = this.createPortalAppendContainer();\n          this.portalContainer.appendChild(this.clonedMenu);\n          document.body.appendChild(this.portalContainer);\n          \n          this.adoptStylesToPortalAppend();\n          \n          this.clonedMenu.style.display = '';\n          this.positionPortalAppend();\n          \n          this.setupPortalEventListeners();\n          \n          this.setupAutoUpdatePositioning();\n          \n          window.addEventListener('resize', this.handleWindowResize.bind(this));\n        }\n      }, 10);\n    });\n  }\n\n  private createPortalMenu(): HTMLElement {\n    return PortalContentUtils.createPortalMenu(this.component);\n  }\n\n  private setupPortalEventListeners(): void {\n    PortalEventUtils.setupPortalEventListeners(this.clonedMenu!, this.component);\n  }\n\n  cleanupPortalAppend(): void {\n    this.cleanupAutoUpdatePositioning();\n    \n    if (this.portalContainer && this.portalContainer.parentNode) {\n      const injectedStyleId = (this.portalContainer as any).__injectedStyleId;\n      if (injectedStyleId) {\n        const styleElement = document.getElementById(injectedStyleId);\n        if (styleElement) {\n          styleElement.remove();\n        }\n      }\n      \n      this.portalContainer.parentNode.removeChild(this.portalContainer);\n    }\n    \n    window.removeEventListener('resize', this.handleWindowResize.bind(this));\n    \n    this.portalContainer = null;\n    this.originalMenuParent = null;\n    this.clonedMenu = null;\n    this.measuredMenuHeight = null;\n    this.currentPlacement = 'bottom';\n    this.currentMiddlewareData = null;\n  }\n\n  get portalContainerElement(): HTMLElement | null {\n    return this.portalContainer;\n  }\n\n  resetMeasuredHeight(): void {\n    this.measuredMenuHeight = null;\n  }\n\n  updatePortalOptions(): void {\n    if (this.portalContainer && this.clonedMenu) {\n      PortalContentUtils.updatePortalMenuItems(this.clonedMenu, this.component);\n      this.forceReposition();\n    }\n  }\n\n  forceReposition(): void {\n    if (this.portalContainer) {\n      this.computeFloatingUIPosition();\n    }\n  }\n\n  getCurrentPlacement(): Placement {\n    return this.currentPlacement;\n  }\n\n  getCurrentMiddlewareData(): MiddlewareData | null {\n    return this.currentMiddlewareData;\n  }\n\n  isUsingFloatingUI(): boolean {\n    return this.cleanupAutoUpdate !== null;\n  }\n\n  isPositioningOptimal(): boolean {\n    if (!this.portalContainer || !this.currentMiddlewareData) return true;\n\n    const referenceElement = this.component.inputElement || this.component;\n    const rect = referenceElement.getBoundingClientRect();\n    const viewportHeight = window.innerHeight;\n    const spaceBelow = viewportHeight - rect.bottom;\n    const spaceAbove = rect.top;\n    \n    const isAbove = this.currentPlacement.startsWith('top');\n    const isBelow = this.currentPlacement.startsWith('bottom');\n    \n    if (isAbove && spaceBelow > spaceAbove) return false;\n    if (isBelow && spaceAbove > spaceBelow) return false;\n    \n    return true;\n  }\n}\n"]}

package/dist/src/nile-auto-complete/portal-utils.d.ts

@@ -0,0 +1,31 @@
+import { type Placement, type MiddlewareData } from '@floating-ui/dom';
+export declare class PortalUtils {
+    static calculateAvailableSpace(referenceElement: HTMLElement): {
+        spaceAbove: number;
+        spaceBelow: number;
+        viewportHeight: number;
+    };
+    static getOptimalPlacement(referenceElement: HTMLElement): Placement;
+    static findBoundaryElements(component: HTMLElement): Element[] | undefined;
+    static calculateOptimalHeight(referenceRect: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }, viewportHeight: number, placement: Placement): number;
+    static extractStylesAsCSS(styles: any): string;
+    static generateStyleId(): string;
+    static isPositioningOptimal(placement: Placement, referenceElement: HTMLElement): boolean;
+    static applyCollisionData(element: HTMLElement, middlewareData: MiddlewareData, placement: Placement): void;
+}
+export declare class PortalContentUtils {
+    static createBaseMenu(component: any): HTMLElement;
+    static addMenuItems(menu: HTMLElement, component: any): void;
+    static createMenuItem(item: any, component: any): HTMLElement;
+    static createPortalMenu(component: any): HTMLElement;
+    static updatePortalMenuItems(clonedMenu: HTMLElement, component: any): void;
+}
+export declare class PortalEventUtils {
+    static setupPortalEventListeners(clonedMenu: HTMLElement, component: any): void;
+    static setupMenuSelectListeners(clonedMenu: HTMLElement, component: any): void;
+}

package/dist/src/nile-auto-complete/portal-utils.js

@@ -0,0 +1,166 @@
+export class PortalUtils {
+    static calculateAvailableSpace(referenceElement) {
+        const rect = referenceElement.getBoundingClientRect();
+        const viewportHeight = window.innerHeight;
+        const spaceBelow = viewportHeight - rect.bottom;
+        const spaceAbove = rect.top;
+        return { spaceAbove, spaceBelow, viewportHeight };
+    }
+    static getOptimalPlacement(referenceElement) {
+        const { spaceAbove, spaceBelow } = this.calculateAvailableSpace(referenceElement);
+        if (spaceBelow < 200 && spaceAbove > spaceBelow) {
+            return 'top';
+        }
+        return 'bottom';
+    }
+    static findBoundaryElements(component) {
+        const boundaryElements = [];
+        let currentElement = component.parentElement;
+        while (currentElement && currentElement !== document.body) {
+            const computedStyle = window.getComputedStyle(currentElement);
+            const overflow = computedStyle.overflow;
+            const overflowY = computedStyle.overflowY;
+            const overflowX = computedStyle.overflowX;
+            if (overflow === 'auto' || overflow === 'scroll' ||
+                overflowY === 'auto' || overflowY === 'scroll' ||
+                overflowX === 'auto' || overflowX === 'scroll') {
+                boundaryElements.push(currentElement);
+            }
+            if (currentElement.hasAttribute('data-floating-boundary') ||
+                currentElement.classList.contains('floating-boundary') ||
+                currentElement.classList.contains('scroll-container')) {
+                boundaryElements.push(currentElement);
+            }
+            currentElement = currentElement.parentElement;
+        }
+        return boundaryElements.length > 0 ? boundaryElements : undefined;
+    }
+    static calculateOptimalHeight(referenceRect, viewportHeight, placement) {
+        const spaceBelow = viewportHeight - (referenceRect.y + referenceRect.height);
+        const spaceAbove = referenceRect.y;
+        if (spaceAbove > spaceBelow) {
+            return Math.max(spaceAbove - 20, 100);
+        }
+        else if (spaceBelow > spaceAbove) {
+            return Math.max(spaceBelow - 20, 100);
+        }
+        return Math.max(Math.min(spaceAbove, spaceBelow) - 20, 100);
+    }
+    static extractStylesAsCSS(styles) {
+        if (typeof styles === 'string') {
+            return styles;
+        }
+        if (Array.isArray(styles)) {
+            return styles.map(style => this.extractStylesAsCSS(style)).join('\n');
+        }
+        if (styles && typeof styles === 'object' && styles.cssText) {
+            return styles.cssText;
+        }
+        return '';
+    }
+    static generateStyleId() {
+        return `nile-auto-complete-styles-${Math.random().toString(36).substring(2, 11)}`;
+    }
+    static isPositioningOptimal(placement, referenceElement) {
+        const { spaceAbove, spaceBelow } = this.calculateAvailableSpace(referenceElement);
+        const isAbove = placement.startsWith('top');
+        const isBelow = placement.startsWith('bottom');
+        if (isAbove && spaceBelow > spaceAbove)
+            return false;
+        if (isBelow && spaceAbove > spaceBelow)
+            return false;
+        return true;
+    }
+    static applyCollisionData(element, middlewareData, placement) {
+        if (middlewareData.flip) {
+            const { overflows } = middlewareData.flip;
+            element.setAttribute('data-placement', placement);
+            if (overflows && overflows.length > 0) {
+                const overflowPlacements = overflows.map(overflow => overflow.placement).join(',');
+                element.setAttribute('data-overflow', overflowPlacements);
+            }
+            else {
+                element.removeAttribute('data-overflow');
+            }
+        }
+        if (middlewareData.shift) {
+            const { x, y } = middlewareData.shift;
+            if (x !== undefined && y !== undefined && (x !== 0 || y !== 0)) {
+                element.setAttribute('data-shift', `${x},${y}`);
+            }
+            else {
+                element.removeAttribute('data-shift');
+            }
+        }
+        if (middlewareData.size) {
+            const { availableWidth, availableHeight } = middlewareData.size;
+            if (availableWidth !== undefined) {
+                element.setAttribute('data-available-width', availableWidth.toString());
+            }
+            if (availableHeight !== undefined) {
+                element.setAttribute('data-available-height', availableHeight.toString());
+            }
+        }
+    }
+}
+export class PortalContentUtils {
+    static createBaseMenu(component) {
+        const menu = document.createElement('nile-menu');
+        menu.id = 'content-menu';
+        menu.className = component.enableVirtualScroll ? 'virtualized__menu' : '';
+        if (component.enableVirtualScroll) {
+            menu.setAttribute('exportparts', 'menu__items-wrapper:options__wrapper');
+        }
+        else {
+            menu.setAttribute('exportparts', 'menu__items-wrapper:options__wrapper');
+        }
+        return menu;
+    }
+    static addMenuItems(menu, component) {
+        const menuItems = component.menuItems || [];
+        menuItems.forEach((item) => {
+            const menuItem = this.createMenuItem(item, component);
+            menu.appendChild(menuItem);
+        });
+    }
+    static createMenuItem(item, component) {
+        const menuItem = document.createElement('nile-menu-item');
+        const value = component.renderItemFunction ? component.renderItemFunction(item) : item;
+        menuItem.setAttribute('value', String(value));
+        menuItem.innerHTML = String(value);
+        return menuItem;
+    }
+    static createPortalMenu(component) {
+        const menu = this.createBaseMenu(component);
+        this.addMenuItems(menu, component);
+        return menu;
+    }
+    static updatePortalMenuItems(clonedMenu, component) {
+        if (!clonedMenu)
+            return;
+        // Remove existing items
+        const existingItems = clonedMenu.querySelectorAll('nile-menu-item');
+        existingItems.forEach(item => item.remove());
+        // Add updated items
+        this.addMenuItems(clonedMenu, component);
+    }
+}
+export class PortalEventUtils {
+    static setupPortalEventListeners(clonedMenu, component) {
+        if (!clonedMenu)
+            return;
+        this.setupMenuSelectListeners(clonedMenu, component);
+    }
+    static setupMenuSelectListeners(clonedMenu, component) {
+        if (!clonedMenu)
+            return;
+        clonedMenu.addEventListener('nile-select', (event) => {
+            const customEvent = event;
+            if (component.handleSelect) {
+                // Call the component's handleSelect method directly
+                component.handleSelect(customEvent);
+            }
+        });
+    }
+}
+//# sourceMappingURL=portal-utils.js.map

package/dist/src/nile-auto-complete/portal-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal-utils.js","sourceRoot":"","sources":["../../../src/nile-auto-complete/portal-utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { \n  type Placement,\n  type MiddlewareData\n} from '@floating-ui/dom';\n\nexport class PortalUtils {\n  static calculateAvailableSpace(referenceElement: HTMLElement): {\n    spaceAbove: number;\n    spaceBelow: number;\n    viewportHeight: number;\n  } {\n    const rect = referenceElement.getBoundingClientRect();\n    const viewportHeight = window.innerHeight;\n    const spaceBelow = viewportHeight - rect.bottom;\n    const spaceAbove = rect.top;\n    \n    return { spaceAbove, spaceBelow, viewportHeight };\n  }\n\n  static getOptimalPlacement(referenceElement: HTMLElement): Placement {\n    const { spaceAbove, spaceBelow } = this.calculateAvailableSpace(referenceElement);\n    \n    if (spaceBelow < 200 && spaceAbove > spaceBelow) {\n      return 'top';\n    }\n    \n    return 'bottom';\n  }\n\n  static findBoundaryElements(component: HTMLElement): Element[] | undefined {\n    const boundaryElements: Element[] = [];\n    \n    let currentElement = component.parentElement;\n    \n    while (currentElement && currentElement !== document.body) {\n      const computedStyle = window.getComputedStyle(currentElement);\n      const overflow = computedStyle.overflow;\n      const overflowY = computedStyle.overflowY;\n      const overflowX = computedStyle.overflowX;\n      \n      if (overflow === 'auto' || overflow === 'scroll' || \n          overflowY === 'auto' || overflowY === 'scroll' ||\n          overflowX === 'auto' || overflowX === 'scroll') {\n        boundaryElements.push(currentElement);\n      }\n      \n      if (currentElement.hasAttribute('data-floating-boundary') ||\n          currentElement.classList.contains('floating-boundary') ||\n          currentElement.classList.contains('scroll-container')) {\n        boundaryElements.push(currentElement);\n      }\n      \n      currentElement = currentElement.parentElement;\n    }\n    \n    return boundaryElements.length > 0 ? boundaryElements : undefined;\n  }\n\n  static calculateOptimalHeight(\n    referenceRect: { x: number; y: number; width: number; height: number },\n    viewportHeight: number,\n    placement: Placement\n  ): number {\n    const spaceBelow = viewportHeight - (referenceRect.y + referenceRect.height);\n    const spaceAbove = referenceRect.y;\n    \n    if (spaceAbove > spaceBelow) {\n      return Math.max(spaceAbove - 20, 100);\n    }\n    else if (spaceBelow > spaceAbove) {\n      return Math.max(spaceBelow - 20, 100);\n    }\n    \n    return Math.max(Math.min(spaceAbove, spaceBelow) - 20, 100);\n  }\n\n  static extractStylesAsCSS(styles: any): string {\n    if (typeof styles === 'string') {\n      return styles;\n    }\n    \n    if (Array.isArray(styles)) {\n      return styles.map(style => this.extractStylesAsCSS(style)).join('\\n');\n    }\n    \n    if (styles && typeof styles === 'object' && styles.cssText) {\n      return styles.cssText;\n    }\n    \n    return '';\n  }\n\n  static generateStyleId(): string {\n    return `nile-auto-complete-styles-${Math.random().toString(36).substring(2, 11)}`;\n  }\n\n  static isPositioningOptimal(\n    placement: Placement,\n    referenceElement: HTMLElement\n  ): boolean {\n    const { spaceAbove, spaceBelow } = this.calculateAvailableSpace(referenceElement);\n    \n    const isAbove = placement.startsWith('top');\n    const isBelow = placement.startsWith('bottom');\n    \n    if (isAbove && spaceBelow > spaceAbove) return false;\n    if (isBelow && spaceAbove > spaceBelow) return false;\n    \n    return true;\n  }\n\n  static applyCollisionData(\n    element: HTMLElement,\n    middlewareData: MiddlewareData,\n    placement: Placement\n  ): void {\n    if (middlewareData.flip) {\n      const { overflows } = middlewareData.flip;\n      \n      element.setAttribute('data-placement', placement);\n      \n      if (overflows && overflows.length > 0) {\n        const overflowPlacements = overflows.map(overflow => overflow.placement).join(',');\n        element.setAttribute('data-overflow', overflowPlacements);\n      } else {\n        element.removeAttribute('data-overflow');\n      }\n    }\n\n    if (middlewareData.shift) {\n      const { x, y } = middlewareData.shift;\n      \n      if (x !== undefined && y !== undefined && (x !== 0 || y !== 0)) {\n        element.setAttribute('data-shift', `${x},${y}`);\n      } else {\n        element.removeAttribute('data-shift');\n      }\n    }\n\n    if (middlewareData.size) {\n      const { availableWidth, availableHeight } = middlewareData.size;\n      \n      if (availableWidth !== undefined) {\n        element.setAttribute('data-available-width', availableWidth.toString());\n      }\n      if (availableHeight !== undefined) {\n        element.setAttribute('data-available-height', availableHeight.toString());\n      }\n    }\n  }\n}\n\nexport class PortalContentUtils {\n  static createBaseMenu(component: any): HTMLElement {\n    const menu = document.createElement('nile-menu');\n    menu.id = 'content-menu';\n    menu.className = component.enableVirtualScroll ? 'virtualized__menu' : '';\n    \n    if (component.enableVirtualScroll) {\n      menu.setAttribute('exportparts', 'menu__items-wrapper:options__wrapper');\n    } else {\n      menu.setAttribute('exportparts', 'menu__items-wrapper:options__wrapper');\n    }\n    \n    return menu;\n  }\n\n  static addMenuItems(menu: HTMLElement, component: any): void {\n    const menuItems = component.menuItems || [];\n    \n    menuItems.forEach((item: any) => {\n      const menuItem = this.createMenuItem(item, component);\n      menu.appendChild(menuItem);\n    });\n  }\n\n  static createMenuItem(item: any, component: any): HTMLElement {\n    const menuItem = document.createElement('nile-menu-item');\n    const value = component.renderItemFunction ? component.renderItemFunction(item) : item;\n    menuItem.setAttribute('value', String(value));\n    menuItem.innerHTML = String(value);\n    return menuItem;\n  }\n\n  static createPortalMenu(component: any): HTMLElement {\n    const menu = this.createBaseMenu(component);\n    this.addMenuItems(menu, component);\n    return menu;\n  }\n\n  static updatePortalMenuItems(clonedMenu: HTMLElement, component: any): void {\n    if (!clonedMenu) return;\n\n    // Remove existing items\n    const existingItems = clonedMenu.querySelectorAll('nile-menu-item');\n    existingItems.forEach(item => item.remove());\n\n    // Add updated items\n    this.addMenuItems(clonedMenu, component);\n  }\n}\n\nexport class PortalEventUtils {\n  static setupPortalEventListeners(clonedMenu: HTMLElement, component: any): void {\n    if (!clonedMenu) return;\n\n    this.setupMenuSelectListeners(clonedMenu, component);\n  }\n\n  static setupMenuSelectListeners(clonedMenu: HTMLElement, component: any): void {\n    if (!clonedMenu) return;\n\n    clonedMenu.addEventListener('nile-select', (event: Event) => {\n      const customEvent = event as CustomEvent;\n      if (component.handleSelect) {\n        // Call the component's handleSelect method directly\n        component.handleSelect(customEvent);\n      }\n    });\n  }\n}\n"]}

package/dist/src/nile-chip/nile-chip.d.ts

@@ -12,6 +12,7 @@ export declare class NileChip extends NileElement {
     tags: string[];
     inputValue: string;
     isDropdownOpen: boolean;
+    tooltips: (string | null)[];
     autoComplete: any;
     /** Sets the input to a warning state, changing its visual appearance. */
     warning: boolean;
@@ -35,6 +36,11 @@ export declare class NileChip extends NileElement {
     readonly: boolean;
     /** Disables the input. */
     disabled: boolean;
+    /**
+     * When true, the dropdown menu will be appended to the document body instead of the parent container.
+     * This is useful when the parent has overflow: hidden, clip-path, or transform applied.
+     */
+    portal: boolean;
     /** Virtual scroll in  dropdown options. */
     enableVirtualScroll: boolean;
     autoCompleteOptions: any[];
@@ -47,6 +53,7 @@ export declare class NileChip extends NileElement {
     errorMessage: string;
     filterFunction: (item: string, searchedValue: string) => boolean;
     renderItemFunction: (item: any) => string;
+    showTooltip: boolean;
     protected updated(changedProperties: PropertyValues): void;
     private handleDocumentClick;
     connectedCallback(): void;