@aquera/nile-elements 0.1.46-beta-2.3 → 0.1.46-beta-2.5

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

@@ -11,7 +11,6 @@ import { styles } from './nile-select.css';
 import '../nile-icon';
 import '../nile-popup/nile-popup';
 import '../nile-tag/nile-tag';
-import '../nile-virtual-select/nile-virtual-select';
 import { animateTo, stopAnimations } from '../internal/animate';
 import { classMap } from 'lit/directives/class-map.js';
 import { query, state } from 'lit/decorators.js';
@@ -25,7 +24,6 @@ import { watch } from '../internal/watch';
 import NileElement from '../internal/nile-element';
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
-import { VirtualScrollHelper } from './virtual-scroll-helper';
 /**
  * Nile icon component.
  *
@@ -40,7 +38,6 @@ import { VirtualScrollHelper } from './virtual-scroll-helper';
  * @dependency nile-icon
  * @dependency nile-popup
  * @dependency nile-tag
- * @dependency nile-virtual-select
  *
  * @slot - The listbox options. Must be `<nile-option>` elements. You can use `<nile-divider>` to group items visually.
  * @slot label - The input's label. Alternatively, you can use the `label` attribute.
@@ -111,12 +108,6 @@ let NileSelect = class NileSelect extends NileElement {
         this.disableLocalSearch = false;
         this.optionsLoading = false;
         this.noWidthSync = false;
-        /** Enable virtual scrolling for large datasets. When enabled, the component will use `nile-virtual-select` internally for better performance with large option lists. */
-        this.enableVirtualScroll = false;
-        /** Array of all option items for virtual scrolling. Required when `enableVirtualScroll` is true. */
-        this.allOptionItems = [];
-        /** Function to render items in virtual select. Defaults to displaying the `label` or `name` property of the item. */
-        this.renderItemFunction = (item) => item?.label || item;
         /** Allows more than one option to be selected. */
         this.multiple = false;
         this.helpText = '';
@@ -172,21 +163,14 @@ let NileSelect = class NileSelect extends NileElement {
     }
     /** Gets the validity state object */
     get validity() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return this.virtualScrollHelper.getValidity();
-        }
         return this.valueInput?.validity;
     }
     /** Gets the validation message */
     get validationMessage() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return this.virtualScrollHelper.getValidationMessage();
-        }
         return this.valueInput?.validationMessage;
     }
     connectedCallback() {
         super.connectedCallback();
-        this.virtualScrollHelper = new VirtualScrollHelper(this);
         this.handleDocumentFocusIn = this.handleDocumentFocusIn.bind(this);
         this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);
         this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);
@@ -209,24 +193,15 @@ let NileSelect = class NileSelect extends NileElement {
         document.removeEventListener('mousedown', this.handleDocumentMouseDown);
     }
     handleFocus() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         this.hasFocus = true;
         this.displayInput.setSelectionRange(0, 0);
         this.emit('nile-focus', { value: this.value, name: this.name });
     }
     handleBlur() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         this.hasFocus = false;
         this.emit('nile-blur', { value: this.value, name: this.name });
     }
     handleDocumentFocusIn(event) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         // Close when focusing out of the select
         const path = event.composedPath();
         if (this && !path.includes(this)) {
@@ -279,9 +254,6 @@ let NileSelect = class NileSelect extends NileElement {
         this.emit('nile-clear', { value: this.multiple ? this.value : '', name: this.name });
     }
     handleDocumentKeyDown(event) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         const target = event.target;
         const isClearButton = target.closest('.select__clear') !== null;
         const isIconButton = target.closest('nile-icon-button') !== null;
@@ -361,9 +333,6 @@ let NileSelect = class NileSelect extends NileElement {
         }
     }
     handleDocumentMouseDown(event) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         // Close when clicking outside of the select
         const path = event.composedPath();
         if (this && !path.includes(this)) {
@@ -375,9 +344,6 @@ let NileSelect = class NileSelect extends NileElement {
         this.hide();
     }
     handleComboboxMouseDown(event) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         const path = event.composedPath();
         const isIconButton = path.some(el => el instanceof Element && el.tagName.toLowerCase() === 'nile-icon-button');
         // Ignore disabled controls and clicks on tags (remove buttons)
@@ -389,16 +355,10 @@ let NileSelect = class NileSelect extends NileElement {
         this.open = !this.open;
     }
     handleComboboxKeyDown(event) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         event.stopPropagation();
         this.handleDocumentKeyDown(event);
     }
     handleClearClick(event) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         event.stopPropagation();
         if (this.value !== '') {
             this.setSelectedOptions([]);
@@ -413,17 +373,11 @@ let NileSelect = class NileSelect extends NileElement {
         }
     }
     handleClearMouseDown(event) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         // Don't lose focus or propagate events when clicking the clear button
         event.stopPropagation();
         event.preventDefault();
     }
     handleOptionClick(event) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         const target = event.target;
         const option = target.closest('nile-option');
         if (this.blockValueChange && option) {
@@ -482,9 +436,6 @@ let NileSelect = class NileSelect extends NileElement {
         }
     }
     handleTagRemove(event, option) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         event.stopPropagation();
         if (!this.disabled) {
             this.toggleOptionSelection(option, false);
@@ -630,21 +581,12 @@ let NileSelect = class NileSelect extends NileElement {
         this.calculateTotalWidthOfTags();
     }
     handleSearchFocus() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         document.removeEventListener('keydown', this.handleDocumentKeyDown);
     }
     handleSearchBlur() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         document.addEventListener('keydown', this.handleDocumentKeyDown);
     }
     handleSearchChange(e) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         this.searchValue = e.detail.value;
         if (!this.disableLocalSearch) {
             let filteredOptions = this.filterOptions(this.searchValue);
@@ -680,10 +622,6 @@ let NileSelect = class NileSelect extends NileElement {
         this.formControlController.emitInvalidEvent(event);
     }
     handleDisabledChange() {
-        // If virtual scroll is enabled, let the virtual select handle disabled changes
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         // Close the listbox when the control is disabled
         if (this.disabled) {
             this.open = false;
@@ -691,20 +629,12 @@ let NileSelect = class NileSelect extends NileElement {
         }
     }
     handleValueChange() {
-        // If virtual scroll is enabled, let the virtual select handle value changes
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         const allOptions = this.getAllOptions();
         const value = Array.isArray(this.value) ? this.value : [this.value];
         // Select only the options that match the new value
         this.setSelectedOptions(allOptions.filter(el => value.includes(el.value)));
     }
     async handleOpenChange() {
-        // If virtual scroll is enabled, let the virtual select handle the open/close logic
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return;
-        }
         if (this.open && !this.disabled) {
             // Reset the current option
             this.setCurrentOption(this.selectedOptions[0] || this.getFirstOption());
@@ -749,9 +679,6 @@ let NileSelect = class NileSelect extends NileElement {
     }
     /** Shows the listbox. */
     async show() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return this.virtualScrollHelper.show();
-        }
         if (this.open || this.disabled) {
             this.open = false;
             return undefined;
@@ -761,9 +688,6 @@ let NileSelect = class NileSelect extends NileElement {
     }
     /** Hides the listbox. */
     async hide() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return this.virtualScrollHelper.hide();
-        }
         if (!this.open || this.disabled) {
             this.open = false;
             return undefined;
@@ -773,9 +697,6 @@ let NileSelect = class NileSelect extends NileElement {
     }
     /** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
     checkValidity() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return this.virtualScrollHelper.checkValidity();
-        }
         return this.valueInput.checkValidity();
     }
     /** Gets the associated form, if one exists. */
@@ -784,38 +705,20 @@ let NileSelect = class NileSelect extends NileElement {
     }
     /** Checks for validity and shows the browser's validation message if the control is invalid. */
     reportValidity() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return this.virtualScrollHelper.reportValidity();
-        }
         return this.valueInput.reportValidity();
     }
     /** Sets a custom validation message. Pass an empty string to restore validity. */
     setCustomValidity(message) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            this.virtualScrollHelper.setCustomValidity(message);
-        }
-        else {
-            this.valueInput.setCustomValidity(message);
-            this.formControlController.updateValidity();
-        }
+        this.valueInput.setCustomValidity(message);
+        this.formControlController.updateValidity();
     }
     /** Sets focus on the control. */
     focus(options) {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            this.virtualScrollHelper.focus(options);
-        }
-        else {
-            this.displayInput.focus(options);
-        }
+        this.displayInput.focus(options);
     }
     /** Removes focus from the control. */
     blur() {
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            this.virtualScrollHelper.blur();
-        }
-        else {
-            this.displayInput.blur();
-        }
+        this.displayInput.blur();
     }
     onInputChange(event) {
         // This will stop the event from bubbling up to the parent `nile-select` component
@@ -866,14 +769,6 @@ let NileSelect = class NileSelect extends NileElement {
         }, 1);
     }
     render() {
-        // If virtual scroll is enabled, render the virtual select component
-        if (this.virtualScrollHelper.isVirtualScrollEnabled()) {
-            return this.virtualScrollHelper.renderVirtualizedContent();
-        }
-        // Otherwise render the regular select content
-        return this.getRegularContent();
-    }
-    getRegularContent() {
         const hasLabelSlot = this.hasSlotController.test('label');
         const hasHelpTextSlot = this.hasSlotController.test('help-text');
         const hasLabelSuffixSlot = this.hasSlotController.test('label-suffix');
@@ -1270,15 +1165,6 @@ __decorate([
 __decorate([
     property({ type: Boolean, reflect: true })
 ], NileSelect.prototype, "noWidthSync", void 0);
-__decorate([
-    property({ type: Boolean })
-], NileSelect.prototype, "enableVirtualScroll", void 0);
-__decorate([
-    property({ type: Array })
-], NileSelect.prototype, "allOptionItems", void 0);
-__decorate([
-    property({ attribute: false })
-], NileSelect.prototype, "renderItemFunction", void 0);
 __decorate([
     property({ type: Boolean, reflect: true })
 ], NileSelect.prototype, "multiple", void 0);