@aquera/nile-elements 1.2.4-beta-1.1 → 1.2.5-beta-1.0

package/dist/src/nile-popover/portal-utils.js

@@ -0,0 +1,322 @@
+export class PortalUtils {
+    static calculateAvailableSpace(referenceElement) {
+        const rect = referenceElement.getBoundingClientRect();
+        const viewportHeight = window.innerHeight;
+        const viewportWidth = window.innerWidth;
+        const spaceBelow = viewportHeight - rect.bottom;
+        const spaceAbove = rect.top;
+        const spaceRight = viewportWidth - rect.right;
+        const spaceLeft = rect.left;
+        return { spaceAbove, spaceBelow, spaceLeft, spaceRight, viewportHeight, viewportWidth };
+    }
+    static getOptimalPlacement(referenceElement) {
+        const { spaceAbove, spaceBelow, spaceLeft, spaceRight } = this.calculateAvailableSpace(referenceElement);
+        // Prioritize vertical placement if there's enough space
+        if (spaceBelow >= 200 && spaceBelow >= spaceAbove) {
+            return 'bottom';
+        }
+        else if (spaceAbove >= 200 && spaceAbove > spaceBelow) {
+            return 'top';
+        }
+        // Fall back to horizontal placement
+        if (spaceRight >= 200 && spaceRight >= spaceLeft) {
+            return 'right';
+        }
+        else if (spaceLeft >= 200) {
+            return 'left';
+        }
+        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 (placement.startsWith('top')) {
+            return Math.max(spaceAbove - 20, 100);
+        }
+        else if (placement.startsWith('bottom')) {
+            return Math.max(spaceBelow - 20, 100);
+        }
+        else if (placement.startsWith('left') || placement.startsWith('right')) {
+            return Math.max(Math.min(spaceAbove, 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-popover-styles-${Math.random().toString(36).substring(2, 11)}`;
+    }
+    static isPositioningOptimal(placement, referenceElement) {
+        const { spaceAbove, spaceBelow, spaceLeft, spaceRight } = this.calculateAvailableSpace(referenceElement);
+        const isAbove = placement.startsWith('top');
+        const isBelow = placement.startsWith('bottom');
+        const isLeft = placement.startsWith('left');
+        const isRight = placement.startsWith('right');
+        if (isAbove && spaceBelow > spaceAbove)
+            return false;
+        if (isBelow && spaceAbove > spaceBelow)
+            return false;
+        if (isLeft && spaceRight > spaceLeft)
+            return false;
+        if (isRight && spaceLeft > spaceRight)
+            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());
+            }
+        }
+    }
+    static createFloatingUIMiddleware(boundary, onSizeApply) {
+        return [];
+    }
+}
+export class PortalContentUtils {
+    static createBasePopover(component) {
+        const popoverBox = document.createElement('div');
+        popoverBox.className = 'popover__box';
+        popoverBox.setAttribute('part', 'popover');
+        return popoverBox;
+    }
+    static addTitleSection(popoverBox, component) {
+        if (!component.title)
+            return;
+        const titleDiv = document.createElement('div');
+        titleDiv.className = 'popover__title';
+        titleDiv.textContent = component.title;
+        popoverBox.appendChild(titleDiv);
+    }
+    static addContentSection(popoverBox, component) {
+        const contentDiv = document.createElement('div');
+        contentDiv.setAttribute('part', 'base');
+        contentDiv.style.display = 'contents';
+        // Clone all child elements that are not explicitly slotted
+        const allChildren = Array.from(component.children);
+        allChildren.forEach((child) => {
+            const slot = child.getAttribute('slot');
+            // Only clone elements that don't have slot="anchor", "title", or "action"
+            if (!slot || (slot !== 'anchor' && slot !== 'title' && slot !== 'action')) {
+                const clonedChild = child.cloneNode(true);
+                contentDiv.appendChild(clonedChild);
+            }
+        });
+        popoverBox.appendChild(contentDiv);
+    }
+    static cloneContent(originalContent, targetContent) {
+        // Clone all child nodes
+        Array.from(originalContent.childNodes).forEach(node => {
+            const clonedNode = node.cloneNode(true);
+            targetContent.appendChild(clonedNode);
+        });
+        // Copy attributes
+        Array.from(originalContent.attributes).forEach(attr => {
+            targetContent.setAttribute(attr.name, attr.value);
+        });
+    }
+    static addActionSection(popoverBox, component) {
+        const actionDiv = document.createElement('div');
+        actionDiv.className = 'popover__action';
+        // Clone action content from component slots
+        const actionSlots = component.querySelectorAll('[slot="action"]');
+        actionSlots.forEach((slot) => {
+            const clonedSlot = slot.cloneNode(true);
+            actionDiv.appendChild(clonedSlot);
+        });
+        popoverBox.appendChild(actionDiv);
+    }
+    static addArrowElement(popoverBox, component) {
+        const arrowDiv = document.createElement('div');
+        arrowDiv.className = 'popup__arrow';
+        arrowDiv.setAttribute('part', 'arrow');
+        arrowDiv.setAttribute('role', 'presentation');
+        // Set CSS custom properties for arrow sizing - match nile-popover exactly (18px)
+        popoverBox.style.setProperty('--arrow-size', '18px');
+        popoverBox.style.setProperty('--arrow-size-diagonal', 'calc(var(--arrow-size) * 0.7071)');
+        popoverBox.style.setProperty('--arrow-padding-offset', 'calc(var(--arrow-size-diagonal) - var(--arrow-size))');
+        popoverBox.style.setProperty('--arrow-color', 'var(--nile-colors-white-base, #ffffff)');
+        // Apply arrow styles similar to nile-popup
+        arrowDiv.style.position = 'absolute';
+        arrowDiv.style.width = 'calc(var(--arrow-size-diagonal) * 2)';
+        arrowDiv.style.height = 'calc(var(--arrow-size-diagonal) * 2)';
+        arrowDiv.style.rotate = '45deg';
+        arrowDiv.style.background = 'var(--arrow-color)';
+        arrowDiv.style.zIndex = '-1';
+        arrowDiv.style.border = 'solid 1px var(--nile-colors-dark-200, #e5e7eb)';
+        arrowDiv.style.boxShadow = '0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03)';
+        popoverBox.appendChild(arrowDiv);
+    }
+    static createPortalPopover(component) {
+        const popoverBox = this.createBasePopover(component);
+        this.addTitleSection(popoverBox, component);
+        this.addContentSection(popoverBox, component);
+        this.addActionSection(popoverBox, component);
+        // Add arrow if enabled
+        if (component.arrow) {
+            this.addArrowElement(popoverBox, component);
+        }
+        return popoverBox;
+    }
+    static updatePortalContent(clonedPopover, component) {
+        if (!clonedPopover)
+            return;
+        // Update title
+        const titleElement = clonedPopover.querySelector('.popover__title');
+        if (titleElement && component.title) {
+            titleElement.textContent = component.title;
+        }
+        // Update content from component children
+        const contentElement = clonedPopover.querySelector('[part="base"]');
+        if (contentElement) {
+            contentElement.innerHTML = '';
+            const allChildren = Array.from(component.children);
+            allChildren.forEach((child) => {
+                const slot = child.getAttribute('slot');
+                // Only clone elements that don't have slot="anchor", "title", or "action"
+                if (!slot || (slot !== 'anchor' && slot !== 'title' && slot !== 'action')) {
+                    const clonedChild = child.cloneNode(true);
+                    contentElement.appendChild(clonedChild);
+                }
+            });
+        }
+        // Update action from component slots
+        const actionElement = clonedPopover.querySelector('.popover__action');
+        if (actionElement) {
+            actionElement.innerHTML = '';
+            const actionSlots = component.querySelectorAll('[slot="action"]');
+            actionSlots.forEach((slot) => {
+                const clonedSlot = slot.cloneNode(true);
+                actionElement.appendChild(clonedSlot);
+            });
+        }
+    }
+}
+export class PortalEventUtils {
+    static setupPortalEventListeners(clonedPopover, component) {
+        if (!clonedPopover)
+            return;
+        this.setupClickListeners(clonedPopover, component);
+        this.setupContentListeners(clonedPopover, component);
+        this.setupActionListeners(clonedPopover, component);
+    }
+    static setupClickListeners(clonedPopover, component) {
+        if (!clonedPopover)
+            return;
+        // Prevent clicks from bubbling to document
+        clonedPopover.addEventListener('click', (event) => {
+            event.stopPropagation();
+        });
+    }
+    static setupContentListeners(clonedPopover, component) {
+        if (!clonedPopover)
+            return;
+        const contentElement = clonedPopover.querySelector('[part="base"]');
+        if (contentElement) {
+            // Forward any custom events from the content
+            contentElement.addEventListener('nile-click', (event) => {
+                if (component.handleContentClick) {
+                    component.handleContentClick(event);
+                }
+            });
+            // Forward form events
+            contentElement.addEventListener('nile-input', (event) => {
+                if (component.handleContentInput) {
+                    component.handleContentInput(event);
+                }
+            });
+            contentElement.addEventListener('nile-change', (event) => {
+                if (component.handleContentChange) {
+                    component.handleContentChange(event);
+                }
+            });
+        }
+    }
+    static setupActionListeners(clonedPopover, component) {
+        if (!clonedPopover)
+            return;
+        const actionElement = clonedPopover.querySelector('.popover__action');
+        if (actionElement) {
+            // Forward action button clicks
+            actionElement.addEventListener('click', (event) => {
+                const target = event.target;
+                if (target.tagName === 'BUTTON' || target.closest('button')) {
+                    if (component.handleActionClick) {
+                        component.handleActionClick(event);
+                    }
+                }
+            });
+            // Forward custom events from action elements
+            actionElement.addEventListener('nile-click', (event) => {
+                if (component.handleActionClick) {
+                    component.handleActionClick(event);
+                }
+            });
+        }
+    }
+    static forwardEventToOriginal(event, component, eventType) {
+        const syntheticEvent = new CustomEvent(eventType, {
+            bubbles: true,
+            cancelable: true,
+            detail: event.detail
+        });
+        component.dispatchEvent(syntheticEvent);
+    }
+}
+//# sourceMappingURL=portal-utils.js.map

package/dist/src/nile-popover/portal-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal-utils.js","sourceRoot":"","sources":["../../../src/nile-popover/portal-utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { \n  type Placement,\n  type MiddlewareData,\n  type ComputePositionConfig,\n  type Boundary\n} from '@floating-ui/dom';\n\nexport class PortalUtils {\n  static calculateAvailableSpace(referenceElement: HTMLElement): {\n    spaceAbove: number;\n    spaceBelow: number;\n    spaceLeft: number;\n    spaceRight: number;\n    viewportHeight: number;\n    viewportWidth: number;\n  } {\n    const rect = referenceElement.getBoundingClientRect();\n    const viewportHeight = window.innerHeight;\n    const viewportWidth = window.innerWidth;\n    const spaceBelow = viewportHeight - rect.bottom;\n    const spaceAbove = rect.top;\n    const spaceRight = viewportWidth - rect.right;\n    const spaceLeft = rect.left;\n    \n    return { spaceAbove, spaceBelow, spaceLeft, spaceRight, viewportHeight, viewportWidth };\n  }\n\n  static getOptimalPlacement(referenceElement: HTMLElement): Placement {\n    const { spaceAbove, spaceBelow, spaceLeft, spaceRight } = this.calculateAvailableSpace(referenceElement);\n    \n    // Prioritize vertical placement if there's enough space\n    if (spaceBelow >= 200 && spaceBelow >= spaceAbove) {\n      return 'bottom';\n    } else if (spaceAbove >= 200 && spaceAbove > spaceBelow) {\n      return 'top';\n    }\n    \n    // Fall back to horizontal placement\n    if (spaceRight >= 200 && spaceRight >= spaceLeft) {\n      return 'right';\n    } else if (spaceLeft >= 200) {\n      return 'left';\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 (placement.startsWith('top')) {\n      return Math.max(spaceAbove - 20, 100);\n    } else if (placement.startsWith('bottom')) {\n      return Math.max(spaceBelow - 20, 100);\n    } else if (placement.startsWith('left') || placement.startsWith('right')) {\n      return Math.max(Math.min(spaceAbove, 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-popover-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, spaceLeft, spaceRight } = this.calculateAvailableSpace(referenceElement);\n    \n    const isAbove = placement.startsWith('top');\n    const isBelow = placement.startsWith('bottom');\n    const isLeft = placement.startsWith('left');\n    const isRight = placement.startsWith('right');\n    \n    if (isAbove && spaceBelow > spaceAbove) return false;\n    if (isBelow && spaceAbove > spaceBelow) return false;\n    if (isLeft && spaceRight > spaceLeft) return false;\n    if (isRight && spaceLeft > spaceRight) 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  static createFloatingUIMiddleware(\n    boundary: Boundary,\n    onSizeApply: (params: {\n      availableWidth: number;\n      availableHeight: number;\n      elements: { floating: HTMLElement };\n      rects: { reference: { x: number; y: number; width: number; height: number } };\n    }) => void\n  ): ComputePositionConfig['middleware'] {\n    return [];\n  }\n}\n\nexport class PortalContentUtils {\n  static createBasePopover(component: any): HTMLElement {\n    const popoverBox = document.createElement('div');\n    popoverBox.className = 'popover__box';\n    popoverBox.setAttribute('part', 'popover');\n    \n    return popoverBox;\n  }\n\n  static addTitleSection(popoverBox: HTMLElement, component: any): void {\n    if (!component.title) return;\n\n    const titleDiv = document.createElement('div');\n    titleDiv.className = 'popover__title';\n    titleDiv.textContent = component.title;\n    popoverBox.appendChild(titleDiv);\n  }\n\n  static addContentSection(popoverBox: HTMLElement, component: any): void {\n    const contentDiv = document.createElement('div');\n    contentDiv.setAttribute('part', 'base');\n    contentDiv.style.display = 'contents';\n    \n    // Clone all child elements that are not explicitly slotted\n    const allChildren = Array.from(component.children);\n    allChildren.forEach((child: Element) => {\n      const slot = child.getAttribute('slot');\n      // Only clone elements that don't have slot=\"anchor\", \"title\", or \"action\"\n      if (!slot || (slot !== 'anchor' && slot !== 'title' && slot !== 'action')) {\n        const clonedChild = child.cloneNode(true) as HTMLElement;\n        contentDiv.appendChild(clonedChild);\n      }\n    });\n    \n    popoverBox.appendChild(contentDiv);\n  }\n\n  static cloneContent(originalContent: HTMLElement, targetContent: HTMLElement): void {\n    // Clone all child nodes\n    Array.from(originalContent.childNodes).forEach(node => {\n      const clonedNode = node.cloneNode(true);\n      targetContent.appendChild(clonedNode);\n    });\n    \n    // Copy attributes\n    Array.from(originalContent.attributes).forEach(attr => {\n      targetContent.setAttribute(attr.name, attr.value);\n    });\n  }\n\n  static addActionSection(popoverBox: HTMLElement, component: any): void {\n    const actionDiv = document.createElement('div');\n    actionDiv.className = 'popover__action';\n    \n    // Clone action content from component slots\n    const actionSlots = component.querySelectorAll('[slot=\"action\"]');\n    actionSlots.forEach((slot: Element) => {\n      const clonedSlot = slot.cloneNode(true) as HTMLElement;\n      actionDiv.appendChild(clonedSlot);\n    });\n    \n    popoverBox.appendChild(actionDiv);\n  }\n\n  static addArrowElement(popoverBox: HTMLElement, component: any): void {\n    const arrowDiv = document.createElement('div');\n    arrowDiv.className = 'popup__arrow';\n    arrowDiv.setAttribute('part', 'arrow');\n    arrowDiv.setAttribute('role', 'presentation');\n    \n    // Set CSS custom properties for arrow sizing - match nile-popover exactly (18px)\n    popoverBox.style.setProperty('--arrow-size', '18px');\n    popoverBox.style.setProperty('--arrow-size-diagonal', 'calc(var(--arrow-size) * 0.7071)');\n    popoverBox.style.setProperty('--arrow-padding-offset', 'calc(var(--arrow-size-diagonal) - var(--arrow-size))');\n    popoverBox.style.setProperty('--arrow-color', 'var(--nile-colors-white-base, #ffffff)');\n    \n    // Apply arrow styles similar to nile-popup\n    arrowDiv.style.position = 'absolute';\n    arrowDiv.style.width = 'calc(var(--arrow-size-diagonal) * 2)';\n    arrowDiv.style.height = 'calc(var(--arrow-size-diagonal) * 2)';\n    arrowDiv.style.rotate = '45deg';\n    arrowDiv.style.background = 'var(--arrow-color)';\n    arrowDiv.style.zIndex = '-1';\n    arrowDiv.style.border = 'solid 1px var(--nile-colors-dark-200, #e5e7eb)';\n    arrowDiv.style.boxShadow = '0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03)';\n    \n    popoverBox.appendChild(arrowDiv);\n  }\n\n  static createPortalPopover(component: any): HTMLElement {\n    const popoverBox = this.createBasePopover(component);\n    \n    this.addTitleSection(popoverBox, component);\n    this.addContentSection(popoverBox, component);\n    this.addActionSection(popoverBox, component);\n    \n    // Add arrow if enabled\n    if (component.arrow) {\n      this.addArrowElement(popoverBox, component);\n    }\n    \n    return popoverBox;\n  }\n\n  static updatePortalContent(clonedPopover: HTMLElement, component: any): void {\n    if (!clonedPopover) return;\n\n    // Update title\n    const titleElement = clonedPopover.querySelector('.popover__title');\n    if (titleElement && component.title) {\n      titleElement.textContent = component.title;\n    }\n\n    // Update content from component children\n    const contentElement = clonedPopover.querySelector('[part=\"base\"]') as HTMLElement;\n    if (contentElement) {\n      contentElement.innerHTML = '';\n      const allChildren = Array.from(component.children);\n      allChildren.forEach((child: Element) => {\n        const slot = child.getAttribute('slot');\n        // Only clone elements that don't have slot=\"anchor\", \"title\", or \"action\"\n        if (!slot || (slot !== 'anchor' && slot !== 'title' && slot !== 'action')) {\n          const clonedChild = child.cloneNode(true) as HTMLElement;\n          contentElement.appendChild(clonedChild);\n        }\n      });\n    }\n\n    // Update action from component slots\n    const actionElement = clonedPopover.querySelector('.popover__action') as HTMLElement;\n    if (actionElement) {\n      actionElement.innerHTML = '';\n      const actionSlots = component.querySelectorAll('[slot=\"action\"]');\n      actionSlots.forEach((slot: Element) => {\n        const clonedSlot = slot.cloneNode(true) as HTMLElement;\n        actionElement.appendChild(clonedSlot);\n      });\n    }\n  }\n}\n\nexport class PortalEventUtils {\n  static setupPortalEventListeners(clonedPopover: HTMLElement, component: any): void {\n    if (!clonedPopover) return;\n\n    this.setupClickListeners(clonedPopover, component);\n    this.setupContentListeners(clonedPopover, component);\n    this.setupActionListeners(clonedPopover, component);\n  }\n\n  static setupClickListeners(clonedPopover: HTMLElement, component: any): void {\n    if (!clonedPopover) return;\n\n    // Prevent clicks from bubbling to document\n    clonedPopover.addEventListener('click', (event) => {\n      event.stopPropagation();\n    });\n  }\n\n  static setupContentListeners(clonedPopover: HTMLElement, component: any): void {\n    if (!clonedPopover) return;\n\n    const contentElement = clonedPopover.querySelector('[part=\"base\"]');\n    if (contentElement) {\n      // Forward any custom events from the content\n      contentElement.addEventListener('nile-click', (event) => {\n        if (component.handleContentClick) {\n          component.handleContentClick(event);\n        }\n      });\n\n      // Forward form events\n      contentElement.addEventListener('nile-input', (event) => {\n        if (component.handleContentInput) {\n          component.handleContentInput(event);\n        }\n      });\n\n      contentElement.addEventListener('nile-change', (event) => {\n        if (component.handleContentChange) {\n          component.handleContentChange(event);\n        }\n      });\n    }\n  }\n\n  static setupActionListeners(clonedPopover: HTMLElement, component: any): void {\n    if (!clonedPopover) return;\n\n    const actionElement = clonedPopover.querySelector('.popover__action');\n    if (actionElement) {\n      // Forward action button clicks\n      actionElement.addEventListener('click', (event) => {\n        const target = event.target as HTMLElement;\n        if (target.tagName === 'BUTTON' || target.closest('button')) {\n          if (component.handleActionClick) {\n            component.handleActionClick(event);\n          }\n        }\n      });\n\n      // Forward custom events from action elements\n      actionElement.addEventListener('nile-click', (event) => {\n        if (component.handleActionClick) {\n          component.handleActionClick(event);\n        }\n      });\n    }\n  }\n\n  static forwardEventToOriginal(event: Event, component: any, eventType: string): void {\n    const syntheticEvent = new CustomEvent(eventType, {\n      bubbles: true,\n      cancelable: true,\n      detail: (event as CustomEvent).detail\n    });\n    \n    component.dispatchEvent(syntheticEvent);\n  }\n}\n"]}

package/dist/src/nile-portal-wrapper/index.d.ts

@@ -0,0 +1 @@
+export { NilePortalWrapper } from './nile-portal-wrapper.js';

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

@@ -0,0 +1,2 @@
+export { NilePortalWrapper } from './nile-portal-wrapper.js';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-portal-wrapper/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC","sourcesContent":["export { NilePortalWrapper } from './nile-portal-wrapper.js';\n"]}

package/dist/src/nile-portal-wrapper/nile-portal-wrapper.d.ts

@@ -0,0 +1,47 @@
+import { LitElement } from 'lit';
+import { type Placement, type Boundary } from '@floating-ui/dom';
+export declare class NilePortalWrapper extends LitElement {
+    enabled: boolean;
+    targetElement: HTMLElement | null;
+    content: HTMLElement | null;
+    placement: Placement;
+    offset: number;
+    padding: number;
+    boundary: Boundary;
+    fallbackPlacements: Placement[];
+    strategy: 'absolute' | 'fixed';
+    className: string;
+    zIndex: number;
+    preserveStyles: boolean;
+    cloneContent: boolean;
+    private portalContainer;
+    private clonedContent;
+    private currentPlacement;
+    private currentMiddlewareData;
+    private measuredHeight;
+    private cleanupAutoUpdate;
+    private injectedStyleId;
+    private resizeObserver;
+    static styles: import("lit").CSSResult;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changedProperties: Map<string | number | symbol, unknown>): void;
+    private setupPortal;
+    private createPortalContainer;
+    private createClonedContent;
+    private createPortalListbox;
+    private cloneOption;
+    private positionPortal;
+    private handleSizeMiddleware;
+    private applyPosition;
+    private fallbackPositioning;
+    private setupAutoUpdate;
+    private setupEventListeners;
+    private handleOptionClick;
+    private forwardEvent;
+    private findOriginalElement;
+    private injectStyles;
+    private extractStylesAsCSS;
+    private cleanup;
+    render(): import("lit-html").TemplateResult<1>;
+}