@aquera/nile-elements 1.2.1-beta-1.0 → 1.2.1-beta-1.1

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

@@ -0,0 +1,376 @@
+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-select-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());
+            }
+        }
+    }
+    static createFloatingUIMiddleware(boundary, onSizeApply) {
+        return [];
+    }
+}
+export class PortalContentUtils {
+    static createBaseListbox(component) {
+        const listbox = document.createElement('div');
+        listbox.className = `select__listbox ${component.searchEnabled ? 'select__search-enabled ' : ''}`;
+        listbox.setAttribute('tabindex', '-1');
+        return listbox;
+    }
+    static addSearchSection(listbox, component) {
+        if (!component.searchEnabled)
+            return;
+        const searchDiv = document.createElement('div');
+        searchDiv.className = 'select__search';
+        searchDiv.innerHTML = `
+      <nile-input size="small" clearable value="${component.searchValue}" placeholder="${component.internalSearchPlaceHolder}">
+        <nile-icon name="var(--nile-icon-search, var(--ng-icon-search-lg))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))" slot="suffix"></nile-icon>
+      </nile-input>
+    `;
+        listbox.appendChild(searchDiv);
+    }
+    static addLoadingSection(listbox, component) {
+        if (!component.optionsLoading)
+            return;
+        const loaderSpan = document.createElement('span');
+        loaderSpan.className = 'select__loader';
+        loaderSpan.innerHTML = `
+      <nile-icon class="select__loader--icon" name="var(--nile-icon-button-loading-blue, var(--ng-icon-button-loading-blue))" method="var(--nile-svg-method-fill, var(--ng-svg-method-stroke))"></nile-icon>
+    `;
+        listbox.appendChild(loaderSpan);
+    }
+    static addOptionsSection(listbox, component) {
+        const optionsContainer = document.createElement('div');
+        optionsContainer.className = `select__options ${component.searchEnabled ? 'select__options__search-enabled' : ''}`;
+        this.addNoResultsMessage(optionsContainer, component);
+        this.addClonedOptions(optionsContainer, component);
+        listbox.appendChild(optionsContainer);
+    }
+    static addNoResultsMessage(container, component) {
+        if (!component.showNoResults)
+            return;
+        const noResultsDiv = document.createElement('div');
+        noResultsDiv.className = 'select__no-results';
+        noResultsDiv.textContent = component.noResultsMessage;
+        container.appendChild(noResultsDiv);
+    }
+    static addClonedOptions(container, component) {
+        const options = Array.from(component.querySelectorAll('nile-option'));
+        options.forEach((option) => {
+            const clonedOption = this.cloneOption(option);
+            container.appendChild(clonedOption);
+        });
+    }
+    static cloneOption(option) {
+        const clonedOption = option.cloneNode(true);
+        Array.from(option.attributes).forEach((attr) => {
+            clonedOption.setAttribute(attr.name, attr.value);
+        });
+        this.copyOptionProperties(option, clonedOption);
+        return clonedOption;
+    }
+    static copyOptionProperties(originalOption, clonedOption) {
+        const properties = ['selected', 'disabled', 'current', 'hidden'];
+        properties.forEach(prop => {
+            if (originalOption[prop] !== undefined) {
+                clonedOption[prop] = originalOption[prop];
+            }
+        });
+    }
+    static addFooterSection(listbox, component) {
+        if (!component.multiple)
+            return;
+        const footerDiv = this.createFooter(component);
+        listbox.appendChild(footerDiv);
+    }
+    static createFooter(component) {
+        const footerDiv = document.createElement('div');
+        footerDiv.setAttribute('part', 'footer');
+        footerDiv.className = 'select__footer';
+        this.addShowSelectedToggle(footerDiv, component);
+        this.addClearAllButton(footerDiv, component);
+        return footerDiv;
+    }
+    static addShowSelectedToggle(footer, component) {
+        const showSelectedSpan = document.createElement('span');
+        showSelectedSpan.style.cursor = 'pointer';
+        const checkbox = document.createElement('nile-checkbox');
+        checkbox.disabled = component.selectedOptions.length === 0;
+        checkbox.checked = component.showSelected;
+        checkbox.innerHTML = '&nbsp; Show Selected';
+        showSelectedSpan.appendChild(checkbox);
+        footer.appendChild(showSelectedSpan);
+    }
+    static addClearAllButton(footer, component) {
+        if (component.selectedOptions.length === 0)
+            return;
+        const clearAllSpan = document.createElement('span');
+        clearAllSpan.className = 'select__clear';
+        clearAllSpan.textContent = 'Clear All';
+        clearAllSpan.style.cursor = 'pointer';
+        footer.appendChild(clearAllSpan);
+    }
+    static updateClonedOptions(clonedListbox, component) {
+        const optionsContainer = clonedListbox.querySelector('.select__options');
+        if (!optionsContainer)
+            return;
+        const originalOptions = Array.from(component.querySelectorAll('nile-option'));
+        const clonedOptions = Array.from(optionsContainer.querySelectorAll('nile-option'));
+        originalOptions.forEach((originalOption, index) => {
+            const clonedOption = clonedOptions[index];
+            if (clonedOption) {
+                this.updateClonedOption(originalOption, clonedOption);
+            }
+        });
+    }
+    static updateClonedOption(originalOption, clonedOption) {
+        clonedOption.selected = originalOption.selected;
+        clonedOption.disabled = originalOption.disabled;
+        clonedOption.current = originalOption.current;
+        clonedOption.hidden = originalOption.hidden;
+        this.updateClonedOptionAttributes(originalOption, clonedOption);
+    }
+    static updateClonedOptionAttributes(originalOption, clonedOption) {
+        const attributes = [
+            { prop: 'selected', attr: 'selected' },
+            { prop: 'disabled', attr: 'disabled' },
+            { prop: 'current', attr: 'current' },
+            { prop: 'hidden', attr: 'hidden' }
+        ];
+        attributes.forEach(({ prop, attr }) => {
+            if (originalOption[prop]) {
+                clonedOption.setAttribute(attr, '');
+            }
+            else {
+                clonedOption.removeAttribute(attr);
+            }
+        });
+    }
+    static createPortalListbox(component) {
+        const listbox = this.createBaseListbox(component);
+        this.addSearchSection(listbox, component);
+        this.addLoadingSection(listbox, component);
+        this.addOptionsSection(listbox, component);
+        this.addFooterSection(listbox, component);
+        return listbox;
+    }
+}
+export class PortalEventUtils {
+    static setupPortalEventListeners(clonedListbox, component) {
+        if (!clonedListbox)
+            return;
+        this.setupOptionClickListeners(clonedListbox, component);
+        this.setupScrollListeners(clonedListbox, component);
+        this.setupSearchListeners(clonedListbox, component);
+        this.setupFooterListeners(clonedListbox, component);
+        this.setupSlotListeners(clonedListbox, component);
+    }
+    static setupOptionClickListeners(clonedListbox, component) {
+        if (!clonedListbox)
+            return;
+        clonedListbox.addEventListener('mouseup', (event) => {
+            const target = event.target;
+            const option = target.closest('nile-option');
+            if (option) {
+                this.handleOptionClick(option, component);
+            }
+        });
+    }
+    static handleOptionClick(option, component) {
+        const originalOption = component.querySelector(`nile-option[value="${option.getAttribute('value')}"]`);
+        if (originalOption) {
+            const syntheticEvent = new MouseEvent('mouseup', {
+                bubbles: true,
+                cancelable: true,
+                view: window
+            });
+            Object.defineProperty(syntheticEvent, 'target', {
+                value: originalOption,
+                writable: false
+            });
+            if (component.handleOptionClick) {
+                component.handleOptionClick(syntheticEvent);
+            }
+        }
+    }
+    static setupScrollListeners(clonedListbox, component) {
+        if (!clonedListbox)
+            return;
+        clonedListbox.addEventListener('scroll', (event) => {
+            if (component.handleScroll) {
+                component.handleScroll(event);
+            }
+        });
+    }
+    static setupSearchListeners(clonedListbox, component) {
+        if (!clonedListbox)
+            return;
+        const searchInput = clonedListbox.querySelector('nile-input');
+        if (searchInput) {
+            searchInput.addEventListener('nile-input', (event) => {
+                if (component.handleSearchChange) {
+                    component.handleSearchChange(event);
+                }
+            });
+            searchInput.addEventListener('nile-focus', (event) => {
+                if (component.handleSearchFocus) {
+                    component.handleSearchFocus();
+                }
+            });
+            searchInput.addEventListener('nile-blur', (event) => {
+                if (component.handleSearchBlur) {
+                    component.handleSearchBlur();
+                }
+            });
+        }
+    }
+    static setupFooterListeners(clonedListbox, component) {
+        if (!clonedListbox)
+            return;
+        const footer = clonedListbox.querySelector('.select__footer');
+        if (footer) {
+            this.setupFooterClickHandlers(footer);
+            this.setupShowSelectedToggle(footer, component);
+            this.setupClearAllHandler(footer, component);
+        }
+    }
+    static setupFooterClickHandlers(footer) {
+        footer.addEventListener('click', (event) => {
+            event.stopPropagation();
+            event.preventDefault();
+        });
+    }
+    static setupShowSelectedToggle(footer, component) {
+        const showSelectedSpan = footer.querySelector('span[style*="cursor: pointer"]');
+        if (showSelectedSpan) {
+            showSelectedSpan.addEventListener('click', (event) => {
+                event.stopPropagation();
+                event.preventDefault();
+                if (component.toggleShowSelected) {
+                    component.toggleShowSelected(event);
+                }
+            });
+        }
+    }
+    static setupClearAllHandler(footer, component) {
+        footer.addEventListener('click', (event) => {
+            const target = event.target;
+            if (target.classList.contains('select__clear')) {
+                event.stopPropagation();
+                event.preventDefault();
+                if (component.unSlectAll) {
+                    component.unSlectAll();
+                }
+            }
+        });
+    }
+    static setupSlotListeners(clonedListbox, component) {
+        if (!clonedListbox)
+            return;
+        const slot = clonedListbox.querySelector('slot');
+        if (slot) {
+            slot.addEventListener('slotchange', () => {
+                if (component.updatePortalContent) {
+                    component.updatePortalContent();
+                }
+            });
+        }
+    }
+}
+//# sourceMappingURL=portal-utils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"portal-utils.js","sourceRoot":"","sources":["../../../src/nile-select/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    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-select-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  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 createBaseListbox(component: any): HTMLElement {\n    const listbox = document.createElement('div');\n    listbox.className = `select__listbox ${component.searchEnabled ? 'select__search-enabled ' : ''}`;\n    listbox.setAttribute('tabindex', '-1');\n    \n    return listbox;\n  }\n\n  static addSearchSection(listbox: HTMLElement, component: any): void {\n    if (!component.searchEnabled) return;\n\n    const searchDiv = document.createElement('div');\n    searchDiv.className = 'select__search';\n    searchDiv.innerHTML = `\n      <nile-input size=\"small\" clearable value=\"${component.searchValue}\" placeholder=\"${component.internalSearchPlaceHolder}\">\n        <nile-icon name=\"var(--nile-icon-search, var(--ng-icon-search-lg))\" method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\" slot=\"suffix\"></nile-icon>\n      </nile-input>\n    `;\n    listbox.appendChild(searchDiv);\n  }\n\n  static addLoadingSection(listbox: HTMLElement, component: any): void {\n    if (!component.optionsLoading) return;\n\n    const loaderSpan = document.createElement('span');\n    loaderSpan.className = 'select__loader';\n    loaderSpan.innerHTML = `\n      <nile-icon class=\"select__loader--icon\" name=\"var(--nile-icon-button-loading-blue, var(--ng-icon-button-loading-blue))\" method=\"var(--nile-svg-method-fill, var(--ng-svg-method-stroke))\"></nile-icon>\n    `;\n    listbox.appendChild(loaderSpan);\n  }\n\n  static addOptionsSection(listbox: HTMLElement, component: any): void {\n    const optionsContainer = document.createElement('div');\n    optionsContainer.className = `select__options ${component.searchEnabled ? 'select__options__search-enabled' : ''}`;\n    \n    this.addNoResultsMessage(optionsContainer, component);\n    this.addClonedOptions(optionsContainer, component);\n    \n    listbox.appendChild(optionsContainer);\n  }\n\n  static addNoResultsMessage(container: HTMLElement, component: any): void {\n    if (!component.showNoResults) return;\n\n    const noResultsDiv = document.createElement('div');\n    noResultsDiv.className = 'select__no-results';\n    noResultsDiv.textContent = component.noResultsMessage;\n    container.appendChild(noResultsDiv);\n  }\n\n  static addClonedOptions(container: HTMLElement, component: any): void {\n    const options = Array.from(component.querySelectorAll('nile-option'));\n    \n    options.forEach((option: Element) => {\n      const clonedOption = this.cloneOption(option as HTMLElement);\n      container.appendChild(clonedOption);\n    });\n  }\n\n  static cloneOption(option: HTMLElement): HTMLElement {\n    const clonedOption = option.cloneNode(true) as HTMLElement;\n    \n    Array.from(option.attributes).forEach((attr: Attr) => {\n      clonedOption.setAttribute(attr.name, attr.value);\n    });\n    \n    this.copyOptionProperties(option, clonedOption);\n    \n    return clonedOption;\n  }\n\n  static copyOptionProperties(originalOption: HTMLElement, clonedOption: HTMLElement): void {\n    const properties = ['selected', 'disabled', 'current', 'hidden'];\n    \n    properties.forEach(prop => {\n      if ((originalOption as any)[prop] !== undefined) {\n        (clonedOption as any)[prop] = (originalOption as any)[prop];\n      }\n    });\n  }\n\n  static addFooterSection(listbox: HTMLElement, component: any): void {\n    if (!component.multiple) return;\n\n    const footerDiv = this.createFooter(component);\n    listbox.appendChild(footerDiv);\n  }\n\n  static createFooter(component: any): HTMLElement {\n    const footerDiv = document.createElement('div');\n    footerDiv.setAttribute('part', 'footer');\n    footerDiv.className = 'select__footer';\n    \n    this.addShowSelectedToggle(footerDiv, component);\n    this.addClearAllButton(footerDiv, component);\n    \n    return footerDiv;\n  }\n\n  static addShowSelectedToggle(footer: HTMLElement, component: any): void {\n    const showSelectedSpan = document.createElement('span');\n    showSelectedSpan.style.cursor = 'pointer';\n    \n    const checkbox = document.createElement('nile-checkbox');\n    checkbox.disabled = component.selectedOptions.length === 0;\n    checkbox.checked = component.showSelected;\n    checkbox.innerHTML = '&nbsp; Show Selected';\n    \n    showSelectedSpan.appendChild(checkbox);\n    footer.appendChild(showSelectedSpan);\n  }\n\n  static addClearAllButton(footer: HTMLElement, component: any): void {\n    if (component.selectedOptions.length === 0) return;\n\n    const clearAllSpan = document.createElement('span');\n    clearAllSpan.className = 'select__clear';\n    clearAllSpan.textContent = 'Clear All';\n    clearAllSpan.style.cursor = 'pointer';\n    footer.appendChild(clearAllSpan);\n  }\n\n  static updateClonedOptions(clonedListbox: HTMLElement, component: any): void {\n    const optionsContainer = clonedListbox.querySelector('.select__options') as HTMLElement;\n    if (!optionsContainer) return;\n\n    const originalOptions = Array.from(component.querySelectorAll('nile-option'));\n    \n    const clonedOptions = Array.from(optionsContainer.querySelectorAll('nile-option'));\n    \n    originalOptions.forEach((originalOption: Element, index: number) => {\n      const clonedOption = clonedOptions[index] as HTMLElement;\n      if (clonedOption) {\n        this.updateClonedOption(originalOption as HTMLElement, clonedOption);\n      }\n    });\n  }\n\n  static updateClonedOption(originalOption: HTMLElement, clonedOption: HTMLElement): void {\n    (clonedOption as any).selected = (originalOption as any).selected;\n    (clonedOption as any).disabled = (originalOption as any).disabled;\n    (clonedOption as any).current = (originalOption as any).current;\n    (clonedOption as any).hidden = (originalOption as any).hidden;\n    \n    this.updateClonedOptionAttributes(originalOption, clonedOption);\n  }\n\n  static updateClonedOptionAttributes(originalOption: HTMLElement, clonedOption: HTMLElement): void {\n    const attributes = [\n      { prop: 'selected', attr: 'selected' },\n      { prop: 'disabled', attr: 'disabled' },\n      { prop: 'current', attr: 'current' },\n      { prop: 'hidden', attr: 'hidden' }\n    ];\n\n    attributes.forEach(({ prop, attr }) => {\n      if ((originalOption as any)[prop]) {\n        clonedOption.setAttribute(attr, '');\n      } else {\n        clonedOption.removeAttribute(attr);\n      }\n    });\n  }\n\n  static createPortalListbox(component: any): HTMLElement {\n    const listbox = this.createBaseListbox(component);\n    \n    this.addSearchSection(listbox, component);\n    this.addLoadingSection(listbox, component);\n    this.addOptionsSection(listbox, component);\n    this.addFooterSection(listbox, component);\n    \n    return listbox;\n  }\n}\n\nexport class PortalEventUtils {\n  static setupPortalEventListeners(clonedListbox: HTMLElement, component: any): void {\n    if (!clonedListbox) return;\n\n    this.setupOptionClickListeners(clonedListbox, component);\n    this.setupScrollListeners(clonedListbox, component);\n    this.setupSearchListeners(clonedListbox, component);\n    this.setupFooterListeners(clonedListbox, component);\n    this.setupSlotListeners(clonedListbox, component);\n  }\n\n  static setupOptionClickListeners(clonedListbox: HTMLElement, component: any): void {\n    if (!clonedListbox) return;\n\n    clonedListbox.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, component);\n      }\n    });\n  }\n\n  static handleOptionClick(option: HTMLElement, component: any): void {\n    const originalOption = component.querySelector(`nile-option[value=\"${option.getAttribute('value')}\"]`) as HTMLElement;\n    if (originalOption) {\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      if (component.handleOptionClick) {\n        component.handleOptionClick(syntheticEvent);\n      }\n    }\n  }\n\n  static setupScrollListeners(clonedListbox: HTMLElement, component: any): void {\n    if (!clonedListbox) return;\n\n    clonedListbox.addEventListener('scroll', (event) => {\n      if (component.handleScroll) {\n        component.handleScroll(event);\n      }\n    });\n  }\n\n  static setupSearchListeners(clonedListbox: HTMLElement, component: any): void {\n    if (!clonedListbox) return;\n\n    const searchInput = clonedListbox.querySelector('nile-input') as HTMLElement;\n    if (searchInput) {\n      searchInput.addEventListener('nile-input', (event) => {\n        if (component.handleSearchChange) {\n          component.handleSearchChange(event);\n        }\n      });\n      \n      searchInput.addEventListener('nile-focus', (event) => {\n        if (component.handleSearchFocus) {\n          component.handleSearchFocus();\n        }\n      });\n      \n      searchInput.addEventListener('nile-blur', (event) => {\n        if (component.handleSearchBlur) {\n          component.handleSearchBlur();\n        }\n      });\n    }\n  }\n\n  static setupFooterListeners(clonedListbox: HTMLElement, component: any): void {\n    if (!clonedListbox) return;\n\n    const footer = clonedListbox.querySelector('.select__footer') as HTMLElement;\n    if (footer) {\n      this.setupFooterClickHandlers(footer);\n      this.setupShowSelectedToggle(footer, component);\n      this.setupClearAllHandler(footer, component);\n    }\n  }\n\n  static setupFooterClickHandlers(footer: HTMLElement): void {\n    footer.addEventListener('click', (event) => {\n      event.stopPropagation();\n      event.preventDefault();\n    });\n  }\n\n  static setupShowSelectedToggle(footer: HTMLElement, component: any): void {\n    const showSelectedSpan = footer.querySelector('span[style*=\"cursor: pointer\"]');\n    if (showSelectedSpan) {\n      showSelectedSpan.addEventListener('click', (event) => {\n        event.stopPropagation();\n        event.preventDefault();\n        if (component.toggleShowSelected) {\n          component.toggleShowSelected(event);\n        }\n      });\n    }\n  }\n\n  static setupClearAllHandler(footer: HTMLElement, component: any): void {\n    footer.addEventListener('click', (event) => {\n      const target = event.target as HTMLElement;\n      if (target.classList.contains('select__clear')) {\n        event.stopPropagation();\n        event.preventDefault();\n        if (component.unSlectAll) {\n          component.unSlectAll();\n        }\n      }\n    });\n  }\n\n  static setupSlotListeners(clonedListbox: HTMLElement, component: any): void {\n    if (!clonedListbox) return;\n\n    const slot = clonedListbox.querySelector('slot');\n    if (slot) {\n      slot.addEventListener('slotchange', () => {\n        if (component.updatePortalContent) {\n          component.updatePortalContent();\n        }\n      });\n    }\n  }\n}\n"]}

package/dist/src/nile-select/virtual-scroll-helper.js

@@ -44,6 +44,7 @@ export class VirtualScrollHelper {
           .data=${component.data}
           .open=${component.open}
           .loading=${component.loading}
+          .portal=${component.portal}
           exportparts="
             select-options,
             select-no-results,

package/dist/src/nile-select/virtual-scroll-helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"virtual-scroll-helper.js","sourceRoot":"","sources":["../../../src/nile-select/virtual-scroll-helper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAG3B;;GAEG;AACH,MAAM,OAAO,mBAAmB;IAG9B,YAAY,SAAsB;QAChC,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;IAC7B,CAAC;IAED,wBAAwB;QACtB,MAAM,SAAS,GAAG,IAAI,CAAC,SAAgB,CAAC;QAExC,OAAO,IAAI,CAAA;;;kBAGG,SAAS,CAAC,IAAI;mBACb,SAAS,CAAC,KAAK;wBACV,SAAS,CAAC,UAAU;yBACnB,SAAS,CAAC,WAAW;kBAC5B,SAAS,CAAC,IAAI;2BACL,SAAS,CAAC,aAAa;uCACX,SAAS,CAAC,yBAAyB;gCAC1C,SAAS,CAAC,kBAAkB;4BAChC,SAAS,CAAC,cAAc;sBAC9B,SAAS,CAAC,QAAQ;sBAClB,SAAS,CAAC,QAAQ;0BACd,SAAS,CAAC,YAAY;qBAC3B,SAAS,CAAC,OAAO;mBACnB,SAAS,CAAC,KAAK;qBACb,SAAS,CAAC,OAAO;sBAChB,SAAS,CAAC,QAAQ;uBACjB,SAAS,CAAC,SAAS;mBACvB,SAAS,CAAC,KAAK;oBACd,SAAS,CAAC,MAAM;kBAClB,SAAS,CAAC,IAAI;mBACb,SAAS,CAAC,KAAK;uBACX,SAAS,CAAC,SAAS;kBACxB,SAAS,CAAC,IAAI;sBACV,SAAS,CAAC,QAAQ;2BACb,SAAS,CAAC,aAAa;8BACpB,SAAS,CAAC,gBAAgB;8BAC1B,SAAS,CAAC,gBAAgB;8BAC1B,SAAS,CAAC,gBAAgB;yBAC/B,SAAS,CAAC,WAAW;+BACf,SAAS,CAAC,iBAAiB;kBACxC,SAAS,CAAC,IAAI;kBACd,SAAS,CAAC,IAAI;qBACX,SAAS,CAAC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;KAyBjC,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { html } from 'lit';\nimport type NileElement from '../internal/nile-element';\n\n/**\n * Helper class to manage virtual scroll functionality for nile-select component\n */\nexport class VirtualScrollHelper {\n  private component: NileElement;\n\n  constructor(component: NileElement) {\n    this.component = component;\n  }\n\n  renderVirtualizedContent(): any {\n    const component = this.component as any;\n\n    return html`\n      <div class=\"virtual-select\">\n        <nile-virtual-select\n          .name=${component.name}\n          .value=${component.value}\n          .autoResize=${component.autoResize}\n          .placeholder=${component.placeholder}\n          .size=${component.size}\n          .searchEnabled=${component.searchEnabled}\n          .internalSearchPlaceHolder=${component.internalSearchPlaceHolder}\n          .disableLocalSearch=${component.disableLocalSearch}\n          .optionsLoading=${component.optionsLoading}\n          .multiple=${component.multiple}\n          .helpText=${component.helpText}\n          .errorMessage=${component.errorMessage}\n          .warning=${component.warning}\n          .error=${component.error}\n          .success=${component.success}\n          .disabled=${component.disabled}\n          .clearable=${component.clearable}\n          .hoist=${component.hoist}\n          .filled=${component.filled}\n          .pill=${component.pill}\n          .label=${component.label}\n          .placement=${component.placement}\n          .form=${component.form}\n          .required=${component.required}\n          .showNoResults=${component.showNoResults}\n          .noResultsMessage=${component.noResultsMessage}\n          .renderItemConfig=${component.renderItemConfig}\n          .blockValueChange=${component.blockValueChange}\n          .noWidthSync=${component.noWidthSync}\n          .maxOptionsVisible=${component.maxOptionsVisible}\n          .data=${component.data}\n          .open=${component.open}\n          .loading=${component.loading}\n          exportparts=\"\n            select-options,\n            select-no-results,\n            virtualized,\n            form-control,\n            form-control-label,\n            form-control-input,\n            combobox,\n            prefix,\n            display-input,\n            tags,\n            tag,\n            clear-button,\n            suffix,\n            expand-icon,\n            listbox,\n            search,\n            loader,\n            footer\n          \"\n        >\n          <slot name=\"prefix\" slot=\"prefix\"></slot>\n        </nile-virtual-select>\n      </div>\n    `;\n  }\n}\n"]}
+{"version":3,"file":"virtual-scroll-helper.js","sourceRoot":"","sources":["../../../src/nile-select/virtual-scroll-helper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAG3B;;GAEG;AACH,MAAM,OAAO,mBAAmB;IAG9B,YAAY,SAAsB;QAChC,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;IAC7B,CAAC;IAED,wBAAwB;QACtB,MAAM,SAAS,GAAG,IAAI,CAAC,SAAgB,CAAC;QAExC,OAAO,IAAI,CAAA;;;kBAGG,SAAS,CAAC,IAAI;mBACb,SAAS,CAAC,KAAK;wBACV,SAAS,CAAC,UAAU;yBACnB,SAAS,CAAC,WAAW;kBAC5B,SAAS,CAAC,IAAI;2BACL,SAAS,CAAC,aAAa;uCACX,SAAS,CAAC,yBAAyB;gCAC1C,SAAS,CAAC,kBAAkB;4BAChC,SAAS,CAAC,cAAc;sBAC9B,SAAS,CAAC,QAAQ;sBAClB,SAAS,CAAC,QAAQ;0BACd,SAAS,CAAC,YAAY;qBAC3B,SAAS,CAAC,OAAO;mBACnB,SAAS,CAAC,KAAK;qBACb,SAAS,CAAC,OAAO;sBAChB,SAAS,CAAC,QAAQ;uBACjB,SAAS,CAAC,SAAS;mBACvB,SAAS,CAAC,KAAK;oBACd,SAAS,CAAC,MAAM;kBAClB,SAAS,CAAC,IAAI;mBACb,SAAS,CAAC,KAAK;uBACX,SAAS,CAAC,SAAS;kBACxB,SAAS,CAAC,IAAI;sBACV,SAAS,CAAC,QAAQ;2BACb,SAAS,CAAC,aAAa;8BACpB,SAAS,CAAC,gBAAgB;8BAC1B,SAAS,CAAC,gBAAgB;8BAC1B,SAAS,CAAC,gBAAgB;yBAC/B,SAAS,CAAC,WAAW;+BACf,SAAS,CAAC,iBAAiB;kBACxC,SAAS,CAAC,IAAI;kBACd,SAAS,CAAC,IAAI;qBACX,SAAS,CAAC,OAAO;oBAClB,SAAS,CAAC,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;KAyB/B,CAAC;IACJ,CAAC;CACF","sourcesContent":["import { html } from 'lit';\nimport type NileElement from '../internal/nile-element';\n\n/**\n * Helper class to manage virtual scroll functionality for nile-select component\n */\nexport class VirtualScrollHelper {\n  private component: NileElement;\n\n  constructor(component: NileElement) {\n    this.component = component;\n  }\n\n  renderVirtualizedContent(): any {\n    const component = this.component as any;\n\n    return html`\n      <div class=\"virtual-select\">\n        <nile-virtual-select\n          .name=${component.name}\n          .value=${component.value}\n          .autoResize=${component.autoResize}\n          .placeholder=${component.placeholder}\n          .size=${component.size}\n          .searchEnabled=${component.searchEnabled}\n          .internalSearchPlaceHolder=${component.internalSearchPlaceHolder}\n          .disableLocalSearch=${component.disableLocalSearch}\n          .optionsLoading=${component.optionsLoading}\n          .multiple=${component.multiple}\n          .helpText=${component.helpText}\n          .errorMessage=${component.errorMessage}\n          .warning=${component.warning}\n          .error=${component.error}\n          .success=${component.success}\n          .disabled=${component.disabled}\n          .clearable=${component.clearable}\n          .hoist=${component.hoist}\n          .filled=${component.filled}\n          .pill=${component.pill}\n          .label=${component.label}\n          .placement=${component.placement}\n          .form=${component.form}\n          .required=${component.required}\n          .showNoResults=${component.showNoResults}\n          .noResultsMessage=${component.noResultsMessage}\n          .renderItemConfig=${component.renderItemConfig}\n          .blockValueChange=${component.blockValueChange}\n          .noWidthSync=${component.noWidthSync}\n          .maxOptionsVisible=${component.maxOptionsVisible}\n          .data=${component.data}\n          .open=${component.open}\n          .loading=${component.loading}\n          .portal=${component.portal}\n          exportparts=\"\n            select-options,\n            select-no-results,\n            virtualized,\n            form-control,\n            form-control-label,\n            form-control-input,\n            combobox,\n            prefix,\n            display-input,\n            tags,\n            tag,\n            clear-button,\n            suffix,\n            expand-icon,\n            listbox,\n            search,\n            loader,\n            footer\n          \"\n        >\n          <slot name=\"prefix\" slot=\"prefix\"></slot>\n        </nile-virtual-select>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/nile-side-bar/index.d.ts

@@ -0,0 +1 @@
+export { NileSideBar } from './nile-side-bar';

package/dist/src/nile-side-bar/index.js

@@ -0,0 +1,2 @@
+export { NileSideBar } from './nile-side-bar';
+//# sourceMappingURL=index.js.map

package/dist/src/nile-side-bar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/nile-side-bar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC","sourcesContent":["export { NileSideBar } from './nile-side-bar';"]}

package/dist/src/nile-side-bar/nile-side-bar.css.d.ts

@@ -0,0 +1,12 @@
+/**
+* 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.
+*/
+/**
+ * SideBar CSS
+ */
+export declare const styles: import("lit").CSSResult;
+declare const _default: import("lit").CSSResult[];
+export default _default;

package/dist/src/nile-side-bar/nile-side-bar.css.js

@@ -0,0 +1,100 @@
+/**
+* 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 { css } from 'lit';
+/**
+ * SideBar CSS
+ */
+export const styles = css `
+ :host {
+  --sidebar-width: 240px;
+  --sidebar-collapsed-width: 70px;
+  top: 0;
+  width: var(--sidebar-width);
+  display: flex;
+  flex-direction: column;
+  background-color: var(--nile-colors-neutral-100);
+  overflow: auto;
+  transition: width 0.25s ease, transform 0.25s ease;
+  z-index: 1000;
+}
+
+ 
+:host([position='left']) {
+  left: 0;
+  border-right: 1px solid var(--nile-colors-neutral-400);
+}
+
+:host([position='right']) {
+  right: 0;
+  border-left: 1px solid var(--nile-colors-neutral-400);
+}
+
+ 
+:host([collapsed]) {
+  width: var(--sidebar-collapsed-width);
+}
+
+ 
+:host([position='right'][collapsed]) {
+  transform: translateX(calc(var(--sidebar-width) - var(--sidebar-collapsed-width)));
+}
+
+ 
+ 
+::slotted(*) {
+  display: block;
+  min-width: 0;
+  /* padding: var(--nile-spacing-xl) */
+}
+
+ 
+:host {
+  scrollbar-width: thin;
+  scrollbar-color: #64748b transparent;
+}
+
+:host::-webkit-scrollbar {
+  width: 6px;
+}
+:host::-webkit-scrollbar-track {
+  background: transparent;
+}
+:host::-webkit-scrollbar-thumb {
+  background-color: #64748b;
+  border-radius: 10px;
+}
+:host([fullheight]) {
+  position: fixed;
+  top: 0;
+  height: 100dvh;
+}
+
+:host(:not([fullheight])) {
+  position: relative;
+  height: 100%;
+}
+::slotted(nile-side-bar-footer) {
+  margin-top: auto;  
+  flex-shrink: 0;   
+}
+:host([collapsed]) ::slotted(nile-side-bar-footer-item) .footer-item {
+  justify-content: center;
+  padding: 0;
+}
+
+:host([collapsed]) ::slotted(nile-side-bar-footer-item) ::slotted([slot='text']),
+:host([collapsed]) ::slotted(nile-side-bar-footer-item) ::slotted([slot='action']) {
+  display: none;
+}
+
+
+
+
+
+`;
+export default [styles];
+//# sourceMappingURL=nile-side-bar.css.js.map

package/dist/src/nile-side-bar/nile-side-bar.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nile-side-bar.css.js","sourceRoot":"","sources":["../../../src/nile-side-bar/nile-side-bar.css.ts"],"names":[],"mappings":"AAAA;;;;;EAKE;AAEF,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AAExB;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuFxB,CAAC;AAEF,eAAe,CAAC,MAAM,CAAC,CAAC","sourcesContent":["/**\n* Copyright Aquera Inc 2023\n*\n* This source code is licensed under the BSD-3-Clause license found in the\n* LICENSE file in the root directory of this source tree.\n*/\n\nimport {css} from 'lit';\n\n/**\n * SideBar CSS\n */\nexport const styles = css`\n :host {\n  --sidebar-width: 240px;\n  --sidebar-collapsed-width: 70px;\n  top: 0;\n  width: var(--sidebar-width);\n  display: flex;\n  flex-direction: column;\n  background-color: var(--nile-colors-neutral-100);\n  overflow: auto;\n  transition: width 0.25s ease, transform 0.25s ease;\n  z-index: 1000;\n}\n\n \n:host([position='left']) {\n  left: 0;\n  border-right: 1px solid var(--nile-colors-neutral-400);\n}\n\n:host([position='right']) {\n  right: 0;\n  border-left: 1px solid var(--nile-colors-neutral-400);\n}\n\n \n:host([collapsed]) {\n  width: var(--sidebar-collapsed-width);\n}\n\n \n:host([position='right'][collapsed]) {\n  transform: translateX(calc(var(--sidebar-width) - var(--sidebar-collapsed-width)));\n}\n\n \n \n::slotted(*) {\n  display: block;\n  min-width: 0;\n  /* padding: var(--nile-spacing-xl) */\n}\n\n \n:host {\n  scrollbar-width: thin;\n  scrollbar-color: #64748b transparent;\n}\n\n:host::-webkit-scrollbar {\n  width: 6px;\n}\n:host::-webkit-scrollbar-track {\n  background: transparent;\n}\n:host::-webkit-scrollbar-thumb {\n  background-color: #64748b;\n  border-radius: 10px;\n}\n:host([fullheight]) {\n  position: fixed;\n  top: 0;\n  height: 100dvh;\n}\n\n:host(:not([fullheight])) {\n  position: relative;\n  height: 100%;\n}\n::slotted(nile-side-bar-footer) {\n  margin-top: auto;  \n  flex-shrink: 0;   \n}\n:host([collapsed]) ::slotted(nile-side-bar-footer-item) .footer-item {\n  justify-content: center;\n  padding: 0;\n}\n\n:host([collapsed]) ::slotted(nile-side-bar-footer-item) ::slotted([slot='text']),\n:host([collapsed]) ::slotted(nile-side-bar-footer-item) ::slotted([slot='action']) {\n  display: none;\n}\n\n\n\n\n\n`;\n\nexport default [styles];"]}

package/dist/src/nile-side-bar/nile-side-bar.d.ts

@@ -0,0 +1,33 @@
+/**
+ * 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 { CSSResultArray, TemplateResult } from 'lit';
+import NileElement from '../internal/nile-element';
+/**
+ * Nile side-bar component.
+ *
+ * @tag nile-side-bar
+ *
+ * @attr position - Position of the sidebar ("left" | "right"). Defaults to "left".
+ * @attr width - Expanded width of the sidebar (px).
+ * @attr collapsed-width - Collapsed width of the sidebar (px).
+ */
+export declare class NileSideBar extends NileElement {
+    position: 'left' | 'right';
+    collapsed: boolean;
+    fullHeight: boolean;
+    width: number | null;
+    collapsedWidth: number | null;
+    static get styles(): CSSResultArray;
+    protected updated(changedProps: Map<string, unknown>): void;
+    render(): TemplateResult;
+}
+export default NileSideBar;
+declare global {
+    interface HTMLElementTagNameMap {
+        'nile-side-bar': NileSideBar;
+    }
+}