@aquera/nile-elements 1.3.1-beta-1.0 → 1.3.1-beta-1

package/dist/src/nile-portal-wrapper/nile-portal-wrapper.js

@@ -0,0 +1,451 @@
+import { __decorate } from "tslib";
+import { LitElement, html, css } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import { autoUpdate, computePosition, flip, offset, shift, size, platform } from '@floating-ui/dom';
+let NilePortalWrapper = class NilePortalWrapper extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.enabled = false;
+        this.targetElement = null;
+        this.content = null;
+        this.placement = 'bottom';
+        this.offset = 4;
+        this.padding = 10;
+        this.boundary = document.documentElement;
+        this.fallbackPlacements = ['bottom', 'top', 'bottom-start', 'top-start', 'bottom-end', 'top-end'];
+        this.strategy = 'fixed';
+        this.className = '';
+        this.zIndex = 9999;
+        this.preserveStyles = true;
+        this.cloneContent = true;
+        this.portalContainer = null;
+        this.clonedContent = null;
+        this.currentPlacement = 'bottom';
+        this.currentMiddlewareData = null;
+        this.measuredHeight = null;
+        this.cleanupAutoUpdate = null;
+        this.injectedStyleId = null;
+        this.resizeObserver = null;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        if (this.enabled) {
+            this.setupPortal();
+        }
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.cleanup();
+    }
+    updated(changedProperties) {
+        super.updated(changedProperties);
+        if (changedProperties.has('enabled')) {
+            if (this.enabled) {
+                this.setupPortal();
+            }
+            else {
+                this.cleanup();
+            }
+        }
+        if (this.enabled && (changedProperties.has('targetElement') || changedProperties.has('content'))) {
+            this.cleanup();
+            this.setupPortal();
+        }
+    }
+    async setupPortal() {
+        if (!this.enabled || !this.targetElement || !this.content)
+            return;
+        await this.updateComplete;
+        // Create portal container
+        this.portalContainer = this.createPortalContainer();
+        document.body.appendChild(this.portalContainer);
+        // Create cloned content
+        this.clonedContent = this.createClonedContent();
+        this.portalContainer.appendChild(this.clonedContent);
+        // Make sure the cloned content is visible
+        this.clonedContent.style.display = '';
+        this.clonedContent.style.visibility = '';
+        // Inject styles if needed
+        if (this.preserveStyles) {
+            this.injectStyles();
+        }
+        // Position the portal
+        await this.positionPortal();
+        // Setup auto-update
+        this.setupAutoUpdate();
+        // Setup event listeners
+        this.setupEventListeners();
+    }
+    createPortalContainer() {
+        const container = document.createElement('div');
+        container.style.position = 'absolute';
+        container.style.zIndex = this.zIndex.toString();
+        container.style.pointerEvents = 'none';
+        container.className = `nile-portal-wrapper ${this.className}`;
+        // Copy CSS classes from the original content to maintain styling context
+        if (this.content) {
+            const contentClasses = Array.from(this.content.classList);
+            contentClasses.forEach(cls => {
+                if (!container.classList.contains(cls)) {
+                    container.classList.add(cls);
+                }
+            });
+        }
+        return container;
+    }
+    createClonedContent() {
+        if (!this.content) {
+            throw new Error('Content element is required for cloning');
+        }
+        // Create a new listbox structure based on the original content
+        const clonedContent = this.createPortalListbox();
+        return clonedContent;
+    }
+    createPortalListbox() {
+        const listbox = document.createElement('div');
+        listbox.className = 'select__listbox';
+        listbox.setAttribute('tabindex', '-1');
+        listbox.setAttribute('role', 'listbox');
+        listbox.setAttribute('aria-expanded', 'true');
+        // Get the nile-select component
+        const selectComponent = this.targetElement?.closest('nile-select');
+        if (!selectComponent)
+            return listbox;
+        // Create options container
+        const optionsContainer = document.createElement('div');
+        optionsContainer.className = 'select__options';
+        // Get options directly from the component (not from the slot)
+        const options = Array.from(selectComponent.querySelectorAll('nile-option'));
+        options.forEach((option) => {
+            const clonedOption = this.cloneOption(option);
+            optionsContainer.appendChild(clonedOption);
+        });
+        listbox.appendChild(optionsContainer);
+        return listbox;
+    }
+    cloneOption(option) {
+        const clonedOption = option.cloneNode(true);
+        // Copy all attributes
+        Array.from(option.attributes).forEach(attr => {
+            clonedOption.setAttribute(attr.name, attr.value);
+        });
+        // Copy properties (matching the original implementation)
+        const properties = ['selected', 'disabled', 'current', 'hidden'];
+        properties.forEach(prop => {
+            if (option[prop] !== undefined) {
+                clonedOption[prop] = option[prop];
+            }
+        });
+        return clonedOption;
+    }
+    async positionPortal() {
+        if (!this.portalContainer || !this.targetElement)
+            return;
+        try {
+            const { x, y, placement, middlewareData } = await computePosition(this.targetElement, this.portalContainer, {
+                placement: this.placement,
+                strategy: this.strategy,
+                middleware: [
+                    offset(this.offset),
+                    size({
+                        apply: this.handleSizeMiddleware.bind(this),
+                        padding: this.padding,
+                        boundary: this.boundary
+                    }),
+                    flip({
+                        fallbackPlacements: this.fallbackPlacements,
+                        fallbackStrategy: 'bestFit',
+                        padding: this.padding,
+                        boundary: this.boundary
+                    }),
+                    shift({
+                        padding: this.padding,
+                        crossAxis: true,
+                        boundary: this.boundary
+                    })
+                ],
+                platform: platform
+            });
+            this.applyPosition(x, y, placement, middlewareData);
+        }
+        catch (error) {
+            console.warn('Floating UI positioning failed, falling back to simple positioning:', error);
+            this.fallbackPositioning();
+        }
+    }
+    handleSizeMiddleware({ availableWidth, availableHeight, elements }) {
+        elements.floating.style.maxWidth = `${availableWidth}px`;
+        elements.floating.style.maxHeight = `${availableHeight}px`;
+    }
+    applyPosition(x, y, placement, middlewareData) {
+        if (!this.portalContainer)
+            return;
+        Object.assign(this.portalContainer.style, {
+            left: `${x}px`,
+            top: `${y}px`,
+            position: this.strategy,
+            pointerEvents: 'auto'
+        });
+        this.currentPlacement = placement;
+        this.currentMiddlewareData = middlewareData;
+        // Apply placement class
+        const placementClass = placement.split('-')[0];
+        this.portalContainer.className = `nile-portal-wrapper select__listbox--${placementClass} ${this.className}`;
+        // Set width to match target element
+        if (this.targetElement) {
+            const targetRect = this.targetElement.getBoundingClientRect();
+            this.portalContainer.style.width = `${targetRect.width}px`;
+        }
+    }
+    fallbackPositioning() {
+        if (!this.portalContainer || !this.targetElement)
+            return;
+        const rect = this.targetElement.getBoundingClientRect();
+        const viewportHeight = window.innerHeight;
+        const popupHeight = this.measuredHeight || 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 - this.offset, 10);
+            placementClass = 'top';
+        }
+        else {
+            maxHeight = Math.max(spaceBelow - 20, 100);
+            topPosition = rect.bottom + this.offset;
+            placementClass = 'bottom';
+        }
+        this.portalContainer.style.left = `${rect.left}px`;
+        this.portalContainer.style.top = `${topPosition}px`;
+        this.portalContainer.style.width = `${rect.width}px`;
+        this.portalContainer.style.maxHeight = `${maxHeight}px`;
+        this.portalContainer.style.pointerEvents = 'auto';
+        this.portalContainer.className = `nile-portal-wrapper select__listbox--${placementClass} ${this.className}`;
+    }
+    setupAutoUpdate() {
+        if (!this.portalContainer || !this.targetElement)
+            return;
+        this.cleanupAutoUpdate = autoUpdate(this.targetElement, this.portalContainer, () => {
+            this.positionPortal();
+        }, {
+            ancestorScroll: true,
+            ancestorResize: true,
+            elementResize: true,
+            layoutShift: true,
+            animationFrame: true
+        });
+    }
+    setupEventListeners() {
+        if (!this.clonedContent)
+            return;
+        // Handle option clicks
+        this.clonedContent.addEventListener('mouseup', (event) => {
+            const target = event.target;
+            const option = target.closest('nile-option');
+            if (option) {
+                this.handleOptionClick(option);
+            }
+        });
+        // Handle other events that need to be forwarded
+        const events = ['click', 'keydown', 'keyup', 'focus', 'blur'];
+        events.forEach(eventType => {
+            this.clonedContent?.addEventListener(eventType, (event) => {
+                this.forwardEvent(event, eventType);
+            });
+        });
+    }
+    handleOptionClick(clonedOption) {
+        if (!this.content)
+            return;
+        // Find the original option by value
+        const value = clonedOption.getAttribute('value');
+        if (!value)
+            return;
+        const originalOption = this.content.querySelector(`nile-option[value="${value}"]`);
+        if (!originalOption)
+            return;
+        // Dispatch a synthetic event on the original option
+        const syntheticEvent = new MouseEvent('mouseup', {
+            bubbles: true,
+            cancelable: true,
+            view: window
+        });
+        Object.defineProperty(syntheticEvent, 'target', {
+            value: originalOption,
+            writable: false
+        });
+        originalOption.dispatchEvent(syntheticEvent);
+    }
+    forwardEvent(event, eventType) {
+        const target = event.target;
+        const originalTarget = this.findOriginalElement(target);
+        if (originalTarget) {
+            const syntheticEvent = new event.constructor(eventType, {
+                view: window,
+                ...event,
+                bubbles: true,
+                cancelable: true
+            });
+            Object.defineProperty(syntheticEvent, 'target', {
+                value: originalTarget,
+                writable: false
+            });
+            originalTarget.dispatchEvent(syntheticEvent);
+        }
+    }
+    findOriginalElement(clonedElement) {
+        if (!this.content || !this.clonedContent)
+            return null;
+        if (clonedElement.tagName === 'NILE-OPTION') {
+            const value = clonedElement.getAttribute('value');
+            if (value) {
+                return this.content.querySelector(`nile-option[value="${value}"]`);
+            }
+        }
+        const tagName = clonedElement.tagName;
+        const attributes = Array.from(clonedElement.attributes).map(attr => `${attr.name}="${attr.value}"`);
+        const originalElements = this.content.querySelectorAll(tagName);
+        for (const original of originalElements) {
+            const originalAttributes = Array.from(original.attributes).map(attr => `${attr.name}="${attr.value}"`);
+            if (JSON.stringify(originalAttributes) === JSON.stringify(attributes)) {
+                return original;
+            }
+        }
+        return null;
+    }
+    injectStyles() {
+        if (!this.preserveStyles || !this.portalContainer)
+            return;
+        const styleId = `nile-portal-styles-${Math.random().toString(36).substring(2, 11)}`;
+        if (document.getElementById(styleId))
+            return;
+        // Try to get styles from the component's constructor
+        const component = this.targetElement?.closest('nile-select');
+        if (component) {
+            const componentStyles = component.constructor.styles;
+            if (componentStyles) {
+                const styleElement = document.createElement('style');
+                styleElement.id = styleId;
+                styleElement.textContent = this.extractStylesAsCSS(componentStyles);
+                document.head.appendChild(styleElement);
+                this.injectedStyleId = styleId;
+                return;
+            }
+        }
+        // Fallback: try to copy styles from shadow root
+        if (this.content) {
+            const shadowRoot = this.content.getRootNode();
+            if (shadowRoot && shadowRoot.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {
+                const styleElements = shadowRoot.querySelectorAll('style');
+                styleElements.forEach(styleEl => {
+                    const styleElement = document.createElement('style');
+                    styleElement.id = `${styleId}-${Math.random().toString(36).substring(2, 6)}`;
+                    styleElement.textContent = styleEl.textContent;
+                    document.head.appendChild(styleElement);
+                });
+                this.injectedStyleId = styleId;
+            }
+        }
+    }
+    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 '';
+    }
+    cleanup() {
+        this.cleanupAutoUpdate?.();
+        this.cleanupAutoUpdate = null;
+        if (this.portalContainer && this.portalContainer.parentNode) {
+            this.portalContainer.parentNode.removeChild(this.portalContainer);
+        }
+        if (this.injectedStyleId) {
+            const styleElement = document.getElementById(this.injectedStyleId);
+            if (styleElement) {
+                styleElement.remove();
+            }
+            this.injectedStyleId = null;
+        }
+        this.portalContainer = null;
+        this.clonedContent = null;
+        this.currentPlacement = 'bottom';
+        this.currentMiddlewareData = null;
+        this.measuredHeight = null;
+    }
+    render() {
+        return html ``;
+    }
+};
+NilePortalWrapper.styles = css `
+    :host {
+      display: none;
+    }
+  `;
+__decorate([
+    property({ type: Boolean })
+], NilePortalWrapper.prototype, "enabled", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], NilePortalWrapper.prototype, "targetElement", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], NilePortalWrapper.prototype, "content", void 0);
+__decorate([
+    property()
+], NilePortalWrapper.prototype, "placement", void 0);
+__decorate([
+    property({ type: Number })
+], NilePortalWrapper.prototype, "offset", void 0);
+__decorate([
+    property({ type: Number })
+], NilePortalWrapper.prototype, "padding", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], NilePortalWrapper.prototype, "boundary", void 0);
+__decorate([
+    property({ type: Array, attribute: false })
+], NilePortalWrapper.prototype, "fallbackPlacements", void 0);
+__decorate([
+    property()
+], NilePortalWrapper.prototype, "strategy", void 0);
+__decorate([
+    property()
+], NilePortalWrapper.prototype, "className", void 0);
+__decorate([
+    property({ type: Number })
+], NilePortalWrapper.prototype, "zIndex", void 0);
+__decorate([
+    property({ type: Boolean })
+], NilePortalWrapper.prototype, "preserveStyles", void 0);
+__decorate([
+    property({ type: Boolean })
+], NilePortalWrapper.prototype, "cloneContent", void 0);
+__decorate([
+    state()
+], NilePortalWrapper.prototype, "portalContainer", void 0);
+__decorate([
+    state()
+], NilePortalWrapper.prototype, "clonedContent", void 0);
+__decorate([
+    state()
+], NilePortalWrapper.prototype, "currentPlacement", void 0);
+__decorate([
+    state()
+], NilePortalWrapper.prototype, "currentMiddlewareData", void 0);
+__decorate([
+    state()
+], NilePortalWrapper.prototype, "measuredHeight", void 0);
+NilePortalWrapper = __decorate([
+    customElement('nile-portal-wrapper')
+], NilePortalWrapper);
+export { NilePortalWrapper };
+//# sourceMappingURL=nile-portal-wrapper.js.map

package/dist/src/nile-portal-wrapper/nile-portal-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-portal-wrapper.js","sourceRoot":"","sources":["../../../src/nile-portal-wrapper/nile-portal-wrapper.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { \n  autoUpdate, \n  computePosition, \n  flip, \n  offset, \n  shift, \n  size, \n  platform,\n  type Placement,\n  type MiddlewareData,\n  type ComputePositionConfig,\n  type Boundary\n} from '@floating-ui/dom';\n\n@customElement('nile-portal-wrapper')\nexport class NilePortalWrapper extends LitElement {\n  @property({ type: Boolean }) enabled = false;\n  @property({ type: Object, attribute: false }) targetElement: HTMLElement | null = null;\n  @property({ type: Object, attribute: false }) content: HTMLElement | null = null;\n  @property() placement: Placement = 'bottom';\n  @property({ type: Number }) offset = 4;\n  @property({ type: Number }) padding = 10;\n  @property({ type: Object, attribute: false }) boundary: Boundary = document.documentElement;\n  @property({ type: Array, attribute: false }) fallbackPlacements: Placement[] = ['bottom', 'top', 'bottom-start', 'top-start', 'bottom-end', 'top-end'];\n  @property() strategy: 'absolute' | 'fixed' = 'fixed';\n  @property() className = '';\n  @property({ type: Number }) zIndex = 9999;\n  @property({ type: Boolean }) preserveStyles = true;\n  @property({ type: Boolean }) cloneContent = true;\n\n  @state() private portalContainer: HTMLElement | null = null;\n  @state() private clonedContent: HTMLElement | null = null;\n  @state() private currentPlacement: Placement = 'bottom';\n  @state() private currentMiddlewareData: MiddlewareData | null = null;\n  @state() private measuredHeight: number | null = null;\n\n  private cleanupAutoUpdate: (() => void) | null = null;\n  private injectedStyleId: string | null = null;\n  private resizeObserver: ResizeObserver | null = null;\n\n  static styles = css`\n    :host {\n      display: none;\n    }\n  `;\n\n  connectedCallback() {\n    super.connectedCallback();\n    if (this.enabled) {\n      this.setupPortal();\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.cleanup();\n  }\n\n  updated(changedProperties: Map<string | number | symbol, unknown>) {\n    super.updated(changedProperties);\n    \n    if (changedProperties.has('enabled')) {\n      if (this.enabled) {\n        this.setupPortal();\n      } else {\n        this.cleanup();\n      }\n    }\n    \n    if (this.enabled && (changedProperties.has('targetElement') || changedProperties.has('content'))) {\n      this.cleanup();\n      this.setupPortal();\n    }\n  }\n\n  private async setupPortal() {\n    if (!this.enabled || !this.targetElement || !this.content) return;\n\n    await this.updateComplete;\n    \n    // Create portal container\n    this.portalContainer = this.createPortalContainer();\n    document.body.appendChild(this.portalContainer);\n    \n    // Create cloned content\n    this.clonedContent = this.createClonedContent();\n    this.portalContainer.appendChild(this.clonedContent);\n    \n    // Make sure the cloned content is visible\n    this.clonedContent.style.display = '';\n    this.clonedContent.style.visibility = '';\n    \n    // Inject styles if needed\n    if (this.preserveStyles) {\n      this.injectStyles();\n    }\n    \n    // Position the portal\n    await this.positionPortal();\n    \n    // Setup auto-update\n    this.setupAutoUpdate();\n    \n    // Setup event listeners\n    this.setupEventListeners();\n  }\n\n  private createPortalContainer(): HTMLElement {\n    const container = document.createElement('div');\n    container.style.position = 'absolute';\n    container.style.zIndex = this.zIndex.toString();\n    container.style.pointerEvents = 'none';\n    container.className = `nile-portal-wrapper ${this.className}`;\n    \n    // Copy CSS classes from the original content to maintain styling context\n    if (this.content) {\n      const contentClasses = Array.from(this.content.classList);\n      contentClasses.forEach(cls => {\n        if (!container.classList.contains(cls)) {\n          container.classList.add(cls);\n        }\n      });\n    }\n    \n    return container;\n  }\n\n  private createClonedContent(): HTMLElement {\n    if (!this.content) {\n      throw new Error('Content element is required for cloning');\n    }\n\n    // Create a new listbox structure based on the original content\n    const clonedContent = this.createPortalListbox();\n    \n    return clonedContent;\n  }\n\n  private createPortalListbox(): HTMLElement {\n    const listbox = document.createElement('div');\n    listbox.className = 'select__listbox';\n    listbox.setAttribute('tabindex', '-1');\n    listbox.setAttribute('role', 'listbox');\n    listbox.setAttribute('aria-expanded', 'true');\n    \n    // Get the nile-select component\n    const selectComponent = this.targetElement?.closest('nile-select');\n    if (!selectComponent) return listbox;\n    \n    // Create options container\n    const optionsContainer = document.createElement('div');\n    optionsContainer.className = 'select__options';\n    \n    // Get options directly from the component (not from the slot)\n    const options = Array.from(selectComponent.querySelectorAll('nile-option'));\n    \n    options.forEach((option: Element) => {\n      const clonedOption = this.cloneOption(option as HTMLElement);\n      optionsContainer.appendChild(clonedOption);\n    });\n    \n    listbox.appendChild(optionsContainer);\n    \n    return listbox;\n  }\n\n  private cloneOption(option: HTMLElement): HTMLElement {\n    const clonedOption = option.cloneNode(true) as HTMLElement;\n    \n    // Copy all attributes\n    Array.from(option.attributes).forEach(attr => {\n      clonedOption.setAttribute(attr.name, attr.value);\n    });\n    \n    // Copy properties (matching the original implementation)\n    const properties = ['selected', 'disabled', 'current', 'hidden'];\n    properties.forEach(prop => {\n      if ((option as any)[prop] !== undefined) {\n        (clonedOption as any)[prop] = (option as any)[prop];\n      }\n    });\n    \n    return clonedOption;\n  }\n\n  private async positionPortal() {\n    if (!this.portalContainer || !this.targetElement) return;\n\n    try {\n      const { x, y, placement, middlewareData } = await computePosition(\n        this.targetElement,\n        this.portalContainer,\n        {\n          placement: this.placement,\n          strategy: this.strategy,\n          middleware: [\n            offset(this.offset),\n            size({\n              apply: this.handleSizeMiddleware.bind(this),\n              padding: this.padding,\n              boundary: this.boundary\n            }),\n            flip({\n              fallbackPlacements: this.fallbackPlacements,\n              fallbackStrategy: 'bestFit',\n              padding: this.padding,\n              boundary: this.boundary\n            }),\n            shift({\n              padding: this.padding,\n              crossAxis: true,\n              boundary: this.boundary\n            })\n          ],\n          platform: platform\n        }\n      );\n\n      this.applyPosition(x, y, placement, middlewareData);\n    } catch (error) {\n      console.warn('Floating UI positioning failed, falling back to simple positioning:', error);\n      this.fallbackPositioning();\n    }\n  }\n\n  private handleSizeMiddleware({ availableWidth, availableHeight, elements }: {\n    availableWidth: number;\n    availableHeight: number;\n    elements: { floating: HTMLElement };\n  }): void {\n    elements.floating.style.maxWidth = `${availableWidth}px`;\n    elements.floating.style.maxHeight = `${availableHeight}px`;\n  }\n\n  private applyPosition(x: number, y: number, placement: Placement, middlewareData: MiddlewareData) {\n    if (!this.portalContainer) return;\n\n    Object.assign(this.portalContainer.style, {\n      left: `${x}px`,\n      top: `${y}px`,\n      position: this.strategy,\n      pointerEvents: 'auto'\n    });\n\n    this.currentPlacement = placement;\n    this.currentMiddlewareData = middlewareData;\n    \n    // Apply placement class\n    const placementClass = placement.split('-')[0];\n    this.portalContainer.className = `nile-portal-wrapper select__listbox--${placementClass} ${this.className}`;\n\n    // Set width to match target element\n    if (this.targetElement) {\n      const targetRect = this.targetElement.getBoundingClientRect();\n      this.portalContainer.style.width = `${targetRect.width}px`;\n    }\n  }\n\n  private fallbackPositioning() {\n    if (!this.portalContainer || !this.targetElement) return;\n\n    const rect = this.targetElement.getBoundingClientRect();\n    const viewportHeight = window.innerHeight;\n    const popupHeight = this.measuredHeight || 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 - this.offset, 10);\n      placementClass = 'top';\n    } else {\n      maxHeight = Math.max(spaceBelow - 20, 100);\n      topPosition = rect.bottom + this.offset;\n      placementClass = 'bottom';\n    }\n\n    this.portalContainer.style.left = `${rect.left}px`;\n    this.portalContainer.style.top = `${topPosition}px`;\n    this.portalContainer.style.width = `${rect.width}px`;\n    this.portalContainer.style.maxHeight = `${maxHeight}px`;\n    this.portalContainer.style.pointerEvents = 'auto';\n    this.portalContainer.className = `nile-portal-wrapper select__listbox--${placementClass} ${this.className}`;\n  }\n\n  private setupAutoUpdate() {\n    if (!this.portalContainer || !this.targetElement) return;\n\n    this.cleanupAutoUpdate = autoUpdate(\n      this.targetElement,\n      this.portalContainer,\n      () => {\n        this.positionPortal();\n      },\n      {\n        ancestorScroll: true,\n        ancestorResize: true,\n        elementResize: true,\n        layoutShift: true,\n        animationFrame: true\n      }\n    );\n  }\n\n  private setupEventListeners() {\n    if (!this.clonedContent) return;\n\n    // Handle option clicks\n    this.clonedContent.addEventListener('mouseup', (event) => {\n      const target = event.target as HTMLElement;\n      const option = target.closest('nile-option');\n      \n      if (option) {\n        this.handleOptionClick(option as HTMLElement);\n      }\n    });\n\n    // Handle other events that need to be forwarded\n    const events = ['click', 'keydown', 'keyup', 'focus', 'blur'];\n    events.forEach(eventType => {\n      this.clonedContent?.addEventListener(eventType, (event) => {\n        this.forwardEvent(event, eventType);\n      });\n    });\n  }\n\n  private handleOptionClick(clonedOption: HTMLElement) {\n    if (!this.content) return;\n\n    // Find the original option by value\n    const value = clonedOption.getAttribute('value');\n    if (!value) return;\n\n    const originalOption = this.content.querySelector(`nile-option[value=\"${value}\"]`) as HTMLElement;\n    if (!originalOption) return;\n\n    // Dispatch a synthetic event on the original option\n    const syntheticEvent = new MouseEvent('mouseup', {\n      bubbles: true,\n      cancelable: true,\n      view: window\n    });\n    \n    Object.defineProperty(syntheticEvent, 'target', {\n      value: originalOption,\n      writable: false\n    });\n    \n    originalOption.dispatchEvent(syntheticEvent);\n  }\n\n  private forwardEvent(event: Event, eventType: string) {\n    const target = event.target as HTMLElement;\n    const originalTarget = this.findOriginalElement(target);\n\n    if (originalTarget) {\n      const syntheticEvent = new (event.constructor as any)(eventType, {\n        view: window,\n        ...event,\n        bubbles: true,\n        cancelable: true\n      });\n\n      Object.defineProperty(syntheticEvent, 'target', {\n        value: originalTarget,\n        writable: false\n      });\n\n      originalTarget.dispatchEvent(syntheticEvent);\n    }\n  }\n\n  private findOriginalElement(clonedElement: HTMLElement): HTMLElement | null {\n    if (!this.content || !this.clonedContent) return null;\n\n    if (clonedElement.tagName === 'NILE-OPTION') {\n      const value = clonedElement.getAttribute('value');\n      if (value) {\n        return this.content.querySelector(`nile-option[value=\"${value}\"]`) as HTMLElement;\n      }\n    }\n\n    const tagName = clonedElement.tagName;\n    const attributes = Array.from(clonedElement.attributes).map(attr => `${attr.name}=\"${attr.value}\"`);\n\n    const originalElements = this.content.querySelectorAll(tagName);\n    for (const original of originalElements) {\n      const originalAttributes = Array.from(original.attributes).map(attr => `${attr.name}=\"${attr.value}\"`);\n      if (JSON.stringify(originalAttributes) === JSON.stringify(attributes)) {\n        return original as HTMLElement;\n      }\n    }\n\n    return null;\n  }\n\n  private injectStyles() {\n    if (!this.preserveStyles || !this.portalContainer) return;\n\n    const styleId = `nile-portal-styles-${Math.random().toString(36).substring(2, 11)}`;\n    \n    if (document.getElementById(styleId)) return;\n\n    // Try to get styles from the component's constructor\n    const component = this.targetElement?.closest('nile-select');\n    if (component) {\n      const componentStyles = (component.constructor as any).styles;\n      if (componentStyles) {\n        const styleElement = document.createElement('style');\n        styleElement.id = styleId;\n        styleElement.textContent = this.extractStylesAsCSS(componentStyles);\n        document.head.appendChild(styleElement);\n        this.injectedStyleId = styleId;\n        return;\n      }\n    }\n\n    // Fallback: try to copy styles from shadow root\n    if (this.content) {\n      const shadowRoot = this.content.getRootNode() as ShadowRoot;\n      if (shadowRoot && shadowRoot.nodeType === Node.DOCUMENT_FRAGMENT_NODE) {\n        const styleElements = shadowRoot.querySelectorAll('style');\n        styleElements.forEach(styleEl => {\n          const styleElement = document.createElement('style');\n          styleElement.id = `${styleId}-${Math.random().toString(36).substring(2, 6)}`;\n          styleElement.textContent = styleEl.textContent;\n          document.head.appendChild(styleElement);\n        });\n        this.injectedStyleId = styleId;\n      }\n    }\n  }\n\n  private 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  private cleanup() {\n    this.cleanupAutoUpdate?.();\n    this.cleanupAutoUpdate = null;\n\n    if (this.portalContainer && this.portalContainer.parentNode) {\n      this.portalContainer.parentNode.removeChild(this.portalContainer);\n    }\n\n    if (this.injectedStyleId) {\n      const styleElement = document.getElementById(this.injectedStyleId);\n      if (styleElement) {\n        styleElement.remove();\n      }\n      this.injectedStyleId = null;\n    }\n\n    this.portalContainer = null;\n    this.clonedContent = null;\n    this.currentPlacement = 'bottom';\n    this.currentMiddlewareData = null;\n    this.measuredHeight = null;\n  }\n\n  render() {\n    return html``;\n  }\n}\n"]}

package/dist/src/nile-select/body-append-manager.d.ts

@@ -0,0 +1,90 @@
+/**
+ * Copyright Aquera Inc 2023
+ *
+ * This source code is licensed under the BSD-3-Clause license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import type NilePopup from '../nile-popup/nile-popup';
+import type NileSelect from './nile-select';
+/**
+ * Manager class for handling bodyAppend functionality in nile-select
+ * This class manages moving select options to document.body to avoid CSS clipping issues
+ */
+export declare class BodyAppendManager {
+    private bodyContainer?;
+    private originalOptions;
+    private boundHandlePopupReposition?;
+    private selectElement;
+    private popup?;
+    private listbox?;
+    private injectedStyleId?;
+    constructor(selectElement: NileSelect);
+    /**
+     * Sets the popup and listbox references
+     */
+    setReferences(popup: NilePopup, listbox: HTMLSlotElement): void;
+    /**
+     * Handles the bodyAppend change
+     */
+    handleBodyAppendChange(bodyAppend: boolean): void;
+    /**
+     * Handles popup reposition events to update body container position
+     */
+    private handlePopupReposition;
+    /**
+     * Extracts styles as CSS string from various style formats
+     */
+    private extractStylesAsCSS;
+    /**
+     * Injects component styles into document head
+     */
+    private injectStylesToDocument;
+    /**
+     * Adopts component styles to the body container (similar to portal-manager pattern)
+     */
+    private adoptStylesToBodyContainer;
+    /**
+     * Creates a body container for options when bodyAppend is true
+     */
+    private createBodyContainer;
+    /**
+     * Cleans up the body container
+     */
+    private cleanupBodyContainer;
+    /**
+     * Moves options to body container when bodyAppend is true
+     */
+    private moveOptionsToBody;
+    /**
+     * Restores options to their original position
+     */
+    private restoreOptionsFromBody;
+    /**
+     * Updates body container visibility and positioning
+     */
+    private updateBodyContainerVisibility;
+    /**
+     * Gets all options from both original location and body container
+     */
+    private getAllOptions;
+    /**
+     * Updates body container visibility when select opens/closes
+     */
+    updateVisibility(visible: boolean): void;
+    /**
+     * Checks if bodyAppend is active (has body container)
+     */
+    isActive(): boolean;
+    /**
+     * Gets the body container element
+     */
+    getBodyContainer(): HTMLElement | undefined;
+    /**
+     * Gets the listbox container element inside the body container
+     */
+    getListboxContainer(): HTMLElement | undefined;
+    /**
+     * Cleans up all resources
+     */
+    destroy(): void;
+}