@tekus/design-system 5.29.2 → 5.31.0

package/fesm2022/tekus-design-system-components-multiselect.mjs

@@ -1,17 +1,135 @@
 import * as i0 from '@angular/core';
-import { inject, signal, model, input, output, computed, ChangeDetectionStrategy, Component } from '@angular/core';
+import { signal, Injectable, inject, viewChild, model, input, output, computed, effect, ChangeDetectionStrategy, Component } from '@angular/core';
 import * as i1 from '@angular/forms';
 import { NgControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
 import * as i2 from 'primeng/multiselect';
 import { MultiSelectModule } from 'primeng/multiselect';
-import * as i3 from 'primeng/floatlabel';
+import * as i4 from 'primeng/floatlabel';
 import { FloatLabelModule } from 'primeng/floatlabel';
-import * as i4 from 'primeng/message';
+import * as i5 from 'primeng/message';
 import { MessageModule } from 'primeng/message';
+import { IconComponent } from '@tekus/design-system/components/icon';
+import { toSignal, toObservable } from '@angular/core/rxjs-interop';
+import { combineLatest, debounceTime, auditTime, distinctUntilChanged, map, tap, switchMap, of, scan } from 'rxjs';
+import * as i3 from 'primeng/api';
+
+class TkMultiSelectManager {
+    constructor() {
+        /**
+         * Reactive signal for the current search query.
+         */
+        this.searchQuery = signal('', ...(ngDevMode ? [{ debugName: "searchQuery" }] : /* istanbul ignore next */ []));
+        /**
+         * Reactive signal for the current pagination page.
+         */
+        this.page = signal(1, ...(ngDevMode ? [{ debugName: "page" }] : /* istanbul ignore next */ []));
+        /**
+         * Additional parameters to send to the data source.
+         */
+        this.fetchParams = signal({}, ...(ngDevMode ? [{ debugName: "fetchParams" }] : /* istanbul ignore next */ []));
+        /**
+         * Sorting field.
+         */
+        this.sortField = signal(undefined, ...(ngDevMode ? [{ debugName: "sortField" }] : /* istanbul ignore next */ []));
+        /**
+         * Sorting order (1 for ASC, -1 for DESC).
+         */
+        this.sortOrder = signal(undefined, ...(ngDevMode ? [{ debugName: "sortOrder" }] : /* istanbul ignore next */ []));
+        /**
+         * Reactive signal indicating if data is currently being fetched.
+         */
+        this.loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+        /**
+         * Reactive signal indicating if there are more items to fetch.
+         */
+        this.hasMore = signal(true, ...(ngDevMode ? [{ debugName: "hasMore" }] : /* istanbul ignore next */ []));
+        /**
+         * Number of items per page to detect the end of data.
+         */
+        this.pageSize = 20;
+        /**
+         * Final accumulated list of items exposed as a Signal.
+         */
+        this.items = toSignal(combineLatest({
+            filter: toObservable(this.searchQuery).pipe(debounceTime(200)),
+            page: toObservable(this.page),
+            params: toObservable(this.fetchParams),
+            sortField: toObservable(this.sortField),
+            sortOrder: toObservable(this.sortOrder),
+        }).pipe(auditTime(0), distinctUntilChanged((prev, curr) => JSON.stringify(prev) === JSON.stringify(curr)), map((data) => ({ ...data, pageSize: this.pageSize })), tap((request) => {
+            if (request.page === 1) {
+                this.hasMore.set(true);
+            }
+            this.loading.set(true);
+        }), switchMap((request) => {
+            const fetcher$ = this.dataSource
+                ? this.dataSource.fetch(request)
+                : of([]);
+            return fetcher$.pipe(tap((results) => {
+                if (results.length < this.pageSize) {
+                    this.hasMore.set(false);
+                }
+            }), map((results) => ({ results, page: request.page })), tap(() => this.loading.set(false)));
+        }), scan((acc, { results, page }) => {
+            return page === 1 ? results : [...acc, ...results];
+        }, [])), { initialValue: [] });
+    }
+    /**
+     * Updates the search query and resets pagination.
+     * @param query - The new search string.
+     */
+    updateSearch(query) {
+        if (this.searchQuery() !== query) {
+            this.searchQuery.set(query);
+            this.page.set(1);
+            this.hasMore.set(true);
+        }
+    }
+    /**
+     * Increments the page to trigger the next data chunk.
+     */
+    loadNextPage() {
+        this.page.update((p) => p + 1);
+    }
+    /**
+     * Configures the data provider for the manager.
+     * @param provider - Object implementing the MultiSelectDataSource interface.
+     */
+    setDataSource(provider) {
+        this.dataSource = provider;
+    }
+    /**
+     * Updates additional fetch parameters and resets pagination.
+     * @param params - The new parameters object.
+     */
+    updateParams(params) {
+        if (JSON.stringify(this.fetchParams()) !== JSON.stringify(params)) {
+            this.fetchParams.set(params);
+            this.page.set(1);
+            this.hasMore.set(true);
+        }
+    }
+    /**
+     * Resets the manager state to its initial values.
+     */
+    reset() {
+        this.searchQuery.set('');
+        this.page.set(1);
+        this.hasMore.set(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: TkMultiSelectManager, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: TkMultiSelectManager }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: TkMultiSelectManager, decorators: [{
+            type: Injectable
+        }] });
 
 class MultiselectComponent {
     constructor() {
         this.ngControl = inject(NgControl, { self: true, optional: true });
+        this.manager = inject((TkMultiSelectManager));
+        /** PrimeNG MultiSelect instance */
+        this.multiselectComponent = viewChild('pMultiselect', ...(ngDevMode ? [{ debugName: "multiselectComponent" }] : /* istanbul ignore next */ []));
         /**
          * @property {Signal<MultiSelectOption[]>} selectionPool
          * @description
@@ -24,6 +142,10 @@ class MultiselectComponent {
          * The model signal for two-way binding.
          */
         this.model = model([], ...(ngDevMode ? [{ debugName: "model" }] : /* istanbul ignore next */ []));
+        /**
+         * Data source for asynchronous infinite scroll mode.
+         */
+        this.dataSource = model(...(ngDevMode ? [undefined, { debugName: "dataSource" }] : /* istanbul ignore next */ []));
         /**
          * @property {MultiSelectOption[]} options
          * @description
@@ -99,17 +221,47 @@ class MultiselectComponent {
          */
         this.styleClass = input('', ...(ngDevMode ? [{ debugName: "styleClass" }] : /* istanbul ignore next */ []));
         /**
-       * @property {InputSignal<string>} errorMessage
-       * @description
-       * Message to display when the control is invalid and touched.
-       */
+         * @property {InputSignal<string>} errorMessage
+         * @description
+         * Message to display when the control is invalid and touched.
+         */
         this.errorMessage = input('', ...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
         /**
-       * @property {InputSignal<string>} hint
-       * @description
-       * Hint text to display below the input.
-       */
+         * @property {InputSignal<string>} hint
+         * @description
+         * Hint text to display below the input.
+         */
         this.hint = input('', ...(ngDevMode ? [{ debugName: "hint" }] : /* istanbul ignore next */ []));
+        /**
+         * Loading state for the dropdown.
+         */
+        this.loading = input(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
+        /**
+         * Text to display when there are no options.
+         */
+        this.emptyMessage = input('No data available', ...(ngDevMode ? [{ debugName: "emptyMessage" }] : /* istanbul ignore next */ []));
+        /**
+         * Additional parameters for the async data source.
+         * Useful for sending context like categoryId, parentId, etc.
+         */
+        this.fetchParams = input({}, ...(ngDevMode ? [{ debugName: "fetchParams" }] : /* istanbul ignore next */ []));
+        /**
+         * Field name to sort by in the async data source.
+         */
+        this.sortField = input(undefined, ...(ngDevMode ? [{ debugName: "sortField" }] : /* istanbul ignore next */ []));
+        /**
+         * Order to sort by (1 for ASC, -1 for DESC).
+         */
+        this.sortOrder = input(undefined, ...(ngDevMode ? [{ debugName: "sortOrder" }] : /* istanbul ignore next */ []));
+        /**
+         * Determines whether the select field is disabled.
+         * @default false
+         */
+        this.disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
+        /**
+         * Internal writable signal for the disabled state.
+         */
+        this.internalDisabled = signal(false, ...(ngDevMode ? [{ debugName: "internalDisabled" }] : /* istanbul ignore next */ []));
         /**
          * @event selectionChange
          * @description
@@ -126,6 +278,8 @@ class MultiselectComponent {
          * Emits the filter text when the user types in the search input.
          */
         this.filterChange = output();
+        this.scrollHandler = this.handleScroll.bind(this);
+        this.lastListContainer = null;
         /**
          * @property internalOptions
          * @description
@@ -133,11 +287,13 @@ class MultiselectComponent {
          * to ensure selected items are always visible.
          */
         this.internalOptions = computed(() => {
-            const currentFromParent = this.options();
+            const currentFromParent = this.dataSource()
+                ? this.manager.items()
+                : this.options();
             const selected = this.selectionPool();
             const merged = [...selected, ...currentFromParent];
             const uniqueMap = new Map();
-            merged.forEach(item => {
+            merged.forEach((item) => {
                 if (item)
                     uniqueMap.set(item.code, item);
             });
@@ -158,6 +314,25 @@ class MultiselectComponent {
         if (this.ngControl) {
             this.ngControl.valueAccessor = this;
         }
+        // Synchronize parameters with the manager
+        effect(() => {
+            this.manager.updateParams(this.fetchParams());
+        });
+        effect(() => {
+            this.manager.sortField.set(this.sortField());
+            this.manager.sortOrder.set(this.sortOrder());
+        });
+        // Synchronize disabled state
+        effect(() => {
+            this.internalDisabled.set(this.disabled());
+        });
+        // Synchronize data source
+        effect(() => {
+            const source = this.dataSource();
+            if (source) {
+                this.manager.setDataSource(source);
+            }
+        });
     }
     /**
      * @method handleFilter
@@ -167,7 +342,11 @@ class MultiselectComponent {
      * @param event - The filter event object.
      */
     handleFilter(event) {
-        this.filterChange.emit(event.filter || '');
+        const query = event.filter || '';
+        if (this.dataSource()) {
+            this.manager.updateSearch(query);
+        }
+        this.filterChange.emit(query);
     }
     /**
      * @method handleChange
@@ -198,10 +377,10 @@ class MultiselectComponent {
      * @param items - The items to add to the pool.
      */
     updateSelectionPool(items) {
-        this.selectionPool.update(prev => {
+        this.selectionPool.update((prev) => {
             const combined = [...prev, ...items];
             const map = new Map();
-            combined.forEach(i => map.set(i.code, i));
+            combined.forEach((i) => map.set(i.code, i));
             return Array.from(map.values());
         });
     }
@@ -240,6 +419,61 @@ class MultiselectComponent {
     registerOnTouched(fn) {
         this.onTouched = fn;
     }
+    /**
+     * Updates the disabled state of the control.
+     * @param isDisabled - Whether the component should be disabled.
+     */
+    setDisabledState(isDisabled) {
+        this.internalDisabled.set(isDisabled);
+    }
+    /**
+     * Adds a scroll listener to the PrimeNG multiselect list container when the panel opens.
+     */
+    onPanelShow() {
+        const listContainer = document.querySelector('.p-multiselect-list-container');
+        if (listContainer) {
+            this.lastListContainer = listContainer;
+            listContainer.addEventListener('scroll', this.scrollHandler);
+        }
+    }
+    /**
+     * Cleans up state, removes listeners and resets the manager when the panel closes.
+     */
+    onPanelHide() {
+        this.removeScrollListener();
+        this.manager.reset();
+    }
+    /**
+     * Cleans up listeners on component destruction.
+     */
+    ngOnDestroy() {
+        this.removeScrollListener();
+    }
+    /**
+     * Safely removes the scroll event listener.
+     */
+    removeScrollListener() {
+        if (this.lastListContainer) {
+            this.lastListContainer.removeEventListener('scroll', this.scrollHandler);
+            this.lastListContainer = null;
+        }
+    }
+    /**
+     * Detects if the user has reached the bottom of the list.
+     */
+    handleScroll(event) {
+        const target = event.target;
+        if (!target)
+            return;
+        // Trigger near the bottom (1px threshold)
+        const atBottom = target.scrollHeight - target.scrollTop <= target.clientHeight + 1;
+        if (atBottom &&
+            this.manager.dataSource &&
+            !this.manager.loading() &&
+            this.manager.hasMore()) {
+            this.manager.loadNextPage();
+        }
+    }
     /**
      * @method effectiveControl
      * @description
@@ -250,22 +484,23 @@ class MultiselectComponent {
         return this.ngControl?.control || null;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: MultiselectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: MultiselectComponent, isStandalone: true, selector: "tk-multiselect", inputs: { model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedLabels: { classPropertyName: "maxSelectedLabels", publicName: "maxSelectedLabels", isSignal: true, isRequired: false, transformFunction: null }, selectedItemsLabel: { classPropertyName: "selectedItemsLabel", publicName: "selectedItemsLabel", isSignal: true, isRequired: false, transformFunction: null }, emptyFilterMessage: { classPropertyName: "emptyFilterMessage", publicName: "emptyFilterMessage", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterPlaceHolder: { classPropertyName: "filterPlaceHolder", publicName: "filterPlaceHolder", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { model: "modelChange", selectionChange: "selectionChange", filterChange: "filterChange" }, ngImport: i0, template: "<p-floatlabel>\n  <p-multiselect\n    optionLabel=\"name\"\n    [id]=\"id()\"\n    [options]=\"options()\"\n    [(ngModel)]=\"model\"\n    [display]=\"display()\"\n    [maxSelectedLabels]=\"maxSelectedLabels()\"\n    [selectedItemsLabel]=\"selectedItemsLabel()\"\n    [emptyFilterMessage]=\"emptyFilterMessage()\"\n    [filter]=\"filter()\"\n    [filterPlaceHolder]=\"filterPlaceHolder()\"\n    [styleClass]=\"styleClass()\"\n    [class.ng-invalid]=\"\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched)\n    \"\n    [class.ng-dirty]=\"effectiveControl?.dirty\"\n    [class.ng-touched]=\"effectiveControl?.touched\"\n    (onFilter)=\"handleFilter($event)\"\n    (onChange)=\"handleChange($event)\">\n  </p-multiselect>\n  <label [for]=\"id()\">{{ labelText() }}</label>\n</p-floatlabel>\n\n<div class=\"tk-select-bottom\">\n  <div class=\"tk-select-messages\">\n    @if (\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched) &&\n      errorMessage()\n    ) {\n      <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n        errorMessage()\n      }}</p-message>\n    } @else if (hint()) {\n      <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{\n        hint()\n      }}</p-message>\n    }\n  </div>\n</div>\n", styles: [":host ::ng-deep .p-multiselect{width:100%;border:none;border-bottom:1px solid var(--tk-color-border-default, #cecdcd);border-radius:0;background-color:transparent}:host ::ng-deep .p-multiselect:focus{border-color:var(--tk-color-primary-default, #16006f)}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(input:focus) label{color:var(--tk-primary-500, #16006f)}:host ::ng-deep .p-floatlabel label{color:var(--tk-surface-700, #424243);font-family:var(--tk-font-family, Poppins, sans-serif);font-size:var(--tk-font-size-2xs, 1rem);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem)}:host ::ng-deep .p-multiselect-option span{color:var(--tk-color-primary-default, #16006f)!important;display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::ng-deep .p-multiselect-option-selected{background-color:var(--tk-color-primary-muted, #b7b0d2)!important}:host ::ng-deep .p-multiselect-chip{background-color:var(--tk-surface-100, #f4f4f5);color:var(--tk-surface-700, #424243);border-radius:var(--tk-borderRadius-full, 999px)!important;padding:4px 8px}:host ::ng-deep .p-multiselect-filter{border:none;border-radius:0;box-shadow:none;border-bottom:1px solid var(--tk-surface-300, #d2d2d2)}:host ::ng-deep .p-overlay{width:-webkit-fill-available}:host ::ng-deep .p-chip-label{display:inline-block;max-width:10ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .p-multiselect-label{gap:.313rem;padding:var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-25, 4px)!important}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i3.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i4.Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant", "motionOptions"], outputs: ["onClose"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.3", type: MultiselectComponent, isStandalone: true, selector: "tk-multiselect", inputs: { model: { classPropertyName: "model", publicName: "model", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, labelText: { classPropertyName: "labelText", publicName: "labelText", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, maxSelectedLabels: { classPropertyName: "maxSelectedLabels", publicName: "maxSelectedLabels", isSignal: true, isRequired: false, transformFunction: null }, selectedItemsLabel: { classPropertyName: "selectedItemsLabel", publicName: "selectedItemsLabel", isSignal: true, isRequired: false, transformFunction: null }, emptyFilterMessage: { classPropertyName: "emptyFilterMessage", publicName: "emptyFilterMessage", isSignal: true, isRequired: false, transformFunction: null }, filter: { classPropertyName: "filter", publicName: "filter", isSignal: true, isRequired: false, transformFunction: null }, filterPlaceHolder: { classPropertyName: "filterPlaceHolder", publicName: "filterPlaceHolder", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: true, isRequired: false, transformFunction: null }, errorMessage: { classPropertyName: "errorMessage", publicName: "errorMessage", isSignal: true, isRequired: false, transformFunction: null }, hint: { classPropertyName: "hint", publicName: "hint", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: true, isRequired: false, transformFunction: null }, fetchParams: { classPropertyName: "fetchParams", publicName: "fetchParams", isSignal: true, isRequired: false, transformFunction: null }, sortField: { classPropertyName: "sortField", publicName: "sortField", isSignal: true, isRequired: false, transformFunction: null }, sortOrder: { classPropertyName: "sortOrder", publicName: "sortOrder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { model: "modelChange", dataSource: "dataSourceChange", selectionChange: "selectionChange", filterChange: "filterChange" }, providers: [TkMultiSelectManager], viewQueries: [{ propertyName: "multiselectComponent", first: true, predicate: ["pMultiselect"], descendants: true, isSignal: true }], ngImport: i0, template: "<p-floatlabel>\n  <p-multiselect\n    #pMultiselect\n    optionLabel=\"name\"\n    [id]=\"id()\"\n    [options]=\"internalOptions()\"\n    [(ngModel)]=\"model\"\n    [display]=\"display()\"\n    [maxSelectedLabels]=\"maxSelectedLabels()\"\n    [selectedItemsLabel]=\"selectedItemsLabel()\"\n    [emptyFilterMessage]=\"emptyFilterMessage()\"\n    [filter]=\"filter()\"\n    [filterPlaceHolder]=\"filterPlaceHolder()\"\n    [styleClass]=\"styleClass()\"\n    [loading]=\"loading() || (dataSource() ? manager.loading() : false)\"\n    [disabled]=\"disabled() || internalDisabled()\"\n    [emptyMessage]=\"emptyMessage()\"\n    [class.ng-invalid]=\"\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched)\n    \"\n    [class.ng-dirty]=\"effectiveControl?.dirty\"\n    [class.ng-touched]=\"effectiveControl?.touched\"\n    (onFilter)=\"handleFilter($event)\"\n    (onChange)=\"handleChange($event)\"\n    (onPanelShow)=\"onPanelShow()\"\n    (onPanelHide)=\"onPanelHide()\"\n    [resetFilterOnHide]=\"true\">\n\n    <ng-template pTemplate=\"empty\">\n      <div class=\"tk-select-empty-container\">\n        <tk-icon icon=\"info\" size=\"2xl\"></tk-icon>\n        <span>{{ emptyMessage() }}</span>\n      </div>\n    </ng-template>\n\n    <ng-template pTemplate=\"emptyfilter\">\n      <div class=\"tk-select-empty-container\">\n        <tk-icon icon=\"magnifying-glass\" size=\"2xl\"></tk-icon>\n        <span>{{ emptyFilterMessage() }}</span>\n      </div>\n    </ng-template>\n  </p-multiselect>\n  <label [for]=\"id()\">{{ labelText() }}</label>\n</p-floatlabel>\n\n<div class=\"tk-select-bottom\">\n  <div class=\"tk-select-messages\">\n    @if (\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched) &&\n      errorMessage()\n    ) {\n      <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n        errorMessage()\n      }}</p-message>\n    } @else if (hint()) {\n      <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{\n        hint()\n      }}</p-message>\n    }\n  </div>\n</div>\n", styles: [":host ::ng-deep .p-multiselect{width:100%;border:none;border-bottom:1px solid var(--tk-color-border-default, #cecdcd);border-radius:0;background-color:transparent}:host ::ng-deep .p-multiselect:focus{border-color:var(--tk-color-primary-default, #16006f)}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(input:focus) label{color:var(--tk-primary-500, #16006f)}:host ::ng-deep .p-floatlabel label{color:var(--tk-surface-700, #424243);font-family:var(--tk-font-family, Poppins, sans-serif);font-size:var(--tk-font-size-2xs, 1rem);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem)}:host ::ng-deep .p-multiselect-option span{color:var(--tk-color-primary-default, #16006f)!important;display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::ng-deep .p-multiselect-option-selected{background-color:var(--tk-color-primary-muted, #b7b0d2)!important}:host ::ng-deep .p-multiselect-chip{background-color:var(--tk-surface-100, #f4f4f5);color:var(--tk-surface-700, #424243);border-radius:var(--tk-borderRadius-full, 999px)!important;padding:4px 8px}:host ::ng-deep .p-multiselect-filter{border:none;border-radius:0;box-shadow:none;border-bottom:1px solid var(--tk-surface-300, #d2d2d2)}:host ::ng-deep .p-overlay{width:-webkit-fill-available}:host ::ng-deep .p-chip-label{display:inline-block;max-width:10ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .p-multiselect-label{gap:.313rem;padding:var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-25, 4px)!important}:host ::ng-deep .tk-select-bottom{display:flex;justify-content:space-between;align-items:flex-start;margin-top:var(--tk-spacing-base-25, .25rem);min-height:var(--tk-spacing-base-125, 1.25rem)}:host ::ng-deep .tk-select-messages{flex:1;margin-right:var(--tk-spacing-base-100, 1rem)}:host ::ng-deep .tk-select-empty-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--tk-spacing-base-150, 1.5rem);text-align:center;color:var(--tk-color-base-surface-500, #8a8a8b)}:host ::ng-deep .tk-select-empty-container tk-icon{margin-bottom:var(--tk-spacing-base-50, .5rem)}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: FloatLabelModule }, { kind: "component", type: i4.FloatLabel, selector: "p-floatlabel, p-floatLabel, p-float-label", inputs: ["variant"] }, { kind: "ngmodule", type: MessageModule }, { kind: "component", type: i5.Message, selector: "p-message", inputs: ["severity", "text", "escape", "style", "styleClass", "closable", "icon", "closeIcon", "life", "showTransitionOptions", "hideTransitionOptions", "size", "variant", "motionOptions"], outputs: ["onClose"] }, { kind: "component", type: IconComponent, selector: "tk-icon", inputs: ["icon", "styleIcon", "color", "size", "disabled"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.3", ngImport: i0, type: MultiselectComponent, decorators: [{
             type: Component,
-            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'tk-multiselect', imports: [
+            args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'tk-multiselect', providers: [TkMultiSelectManager], imports: [
                         ReactiveFormsModule,
                         FormsModule,
                         MultiSelectModule,
                         FloatLabelModule,
-                        MessageModule
-                    ], template: "<p-floatlabel>\n  <p-multiselect\n    optionLabel=\"name\"\n    [id]=\"id()\"\n    [options]=\"options()\"\n    [(ngModel)]=\"model\"\n    [display]=\"display()\"\n    [maxSelectedLabels]=\"maxSelectedLabels()\"\n    [selectedItemsLabel]=\"selectedItemsLabel()\"\n    [emptyFilterMessage]=\"emptyFilterMessage()\"\n    [filter]=\"filter()\"\n    [filterPlaceHolder]=\"filterPlaceHolder()\"\n    [styleClass]=\"styleClass()\"\n    [class.ng-invalid]=\"\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched)\n    \"\n    [class.ng-dirty]=\"effectiveControl?.dirty\"\n    [class.ng-touched]=\"effectiveControl?.touched\"\n    (onFilter)=\"handleFilter($event)\"\n    (onChange)=\"handleChange($event)\">\n  </p-multiselect>\n  <label [for]=\"id()\">{{ labelText() }}</label>\n</p-floatlabel>\n\n<div class=\"tk-select-bottom\">\n  <div class=\"tk-select-messages\">\n    @if (\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched) &&\n      errorMessage()\n    ) {\n      <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n        errorMessage()\n      }}</p-message>\n    } @else if (hint()) {\n      <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{\n        hint()\n      }}</p-message>\n    }\n  </div>\n</div>\n", styles: [":host ::ng-deep .p-multiselect{width:100%;border:none;border-bottom:1px solid var(--tk-color-border-default, #cecdcd);border-radius:0;background-color:transparent}:host ::ng-deep .p-multiselect:focus{border-color:var(--tk-color-primary-default, #16006f)}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(input:focus) label{color:var(--tk-primary-500, #16006f)}:host ::ng-deep .p-floatlabel label{color:var(--tk-surface-700, #424243);font-family:var(--tk-font-family, Poppins, sans-serif);font-size:var(--tk-font-size-2xs, 1rem);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem)}:host ::ng-deep .p-multiselect-option span{color:var(--tk-color-primary-default, #16006f)!important;display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::ng-deep .p-multiselect-option-selected{background-color:var(--tk-color-primary-muted, #b7b0d2)!important}:host ::ng-deep .p-multiselect-chip{background-color:var(--tk-surface-100, #f4f4f5);color:var(--tk-surface-700, #424243);border-radius:var(--tk-borderRadius-full, 999px)!important;padding:4px 8px}:host ::ng-deep .p-multiselect-filter{border:none;border-radius:0;box-shadow:none;border-bottom:1px solid var(--tk-surface-300, #d2d2d2)}:host ::ng-deep .p-overlay{width:-webkit-fill-available}:host ::ng-deep .p-chip-label{display:inline-block;max-width:10ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .p-multiselect-label{gap:.313rem;padding:var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-25, 4px)!important}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { model: [{ type: i0.Input, args: [{ isSignal: true, alias: "model", required: false }] }, { type: i0.Output, args: ["modelChange"] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], maxSelectedLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelectedLabels", required: false }] }], selectedItemsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItemsLabel", required: false }] }], emptyFilterMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyFilterMessage", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterPlaceHolder: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPlaceHolder", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }] } });
+                        MessageModule,
+                        IconComponent,
+                    ], template: "<p-floatlabel>\n  <p-multiselect\n    #pMultiselect\n    optionLabel=\"name\"\n    [id]=\"id()\"\n    [options]=\"internalOptions()\"\n    [(ngModel)]=\"model\"\n    [display]=\"display()\"\n    [maxSelectedLabels]=\"maxSelectedLabels()\"\n    [selectedItemsLabel]=\"selectedItemsLabel()\"\n    [emptyFilterMessage]=\"emptyFilterMessage()\"\n    [filter]=\"filter()\"\n    [filterPlaceHolder]=\"filterPlaceHolder()\"\n    [styleClass]=\"styleClass()\"\n    [loading]=\"loading() || (dataSource() ? manager.loading() : false)\"\n    [disabled]=\"disabled() || internalDisabled()\"\n    [emptyMessage]=\"emptyMessage()\"\n    [class.ng-invalid]=\"\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched)\n    \"\n    [class.ng-dirty]=\"effectiveControl?.dirty\"\n    [class.ng-touched]=\"effectiveControl?.touched\"\n    (onFilter)=\"handleFilter($event)\"\n    (onChange)=\"handleChange($event)\"\n    (onPanelShow)=\"onPanelShow()\"\n    (onPanelHide)=\"onPanelHide()\"\n    [resetFilterOnHide]=\"true\">\n\n    <ng-template pTemplate=\"empty\">\n      <div class=\"tk-select-empty-container\">\n        <tk-icon icon=\"info\" size=\"2xl\"></tk-icon>\n        <span>{{ emptyMessage() }}</span>\n      </div>\n    </ng-template>\n\n    <ng-template pTemplate=\"emptyfilter\">\n      <div class=\"tk-select-empty-container\">\n        <tk-icon icon=\"magnifying-glass\" size=\"2xl\"></tk-icon>\n        <span>{{ emptyFilterMessage() }}</span>\n      </div>\n    </ng-template>\n  </p-multiselect>\n  <label [for]=\"id()\">{{ labelText() }}</label>\n</p-floatlabel>\n\n<div class=\"tk-select-bottom\">\n  <div class=\"tk-select-messages\">\n    @if (\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched) &&\n      errorMessage()\n    ) {\n      <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n        errorMessage()\n      }}</p-message>\n    } @else if (hint()) {\n      <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{\n        hint()\n      }}</p-message>\n    }\n  </div>\n</div>\n", styles: [":host ::ng-deep .p-multiselect{width:100%;border:none;border-bottom:1px solid var(--tk-color-border-default, #cecdcd);border-radius:0;background-color:transparent}:host ::ng-deep .p-multiselect:focus{border-color:var(--tk-color-primary-default, #16006f)}:host ::ng-deep .p-floatlabel:has(.p-inputwrapper-filled) label,:host ::ng-deep .p-floatlabel:has(input:focus) label{color:var(--tk-primary-500, #16006f)}:host ::ng-deep .p-floatlabel label{color:var(--tk-surface-700, #424243);font-family:var(--tk-font-family, Poppins, sans-serif);font-size:var(--tk-font-size-2xs, 1rem);font-weight:var(--tk-font-weight-400, 400);left:var(--tk-spacing-base-25, .25rem)}:host ::ng-deep .p-multiselect-option span{color:var(--tk-color-primary-default, #16006f)!important;display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::ng-deep .p-multiselect-option-selected{background-color:var(--tk-color-primary-muted, #b7b0d2)!important}:host ::ng-deep .p-multiselect-chip{background-color:var(--tk-surface-100, #f4f4f5);color:var(--tk-surface-700, #424243);border-radius:var(--tk-borderRadius-full, 999px)!important;padding:4px 8px}:host ::ng-deep .p-multiselect-filter{border:none;border-radius:0;box-shadow:none;border-bottom:1px solid var(--tk-surface-300, #d2d2d2)}:host ::ng-deep .p-overlay{width:-webkit-fill-available}:host ::ng-deep .p-chip-label{display:inline-block;max-width:10ch;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host ::ng-deep .p-multiselect-label{gap:.313rem;padding:var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-75, 12px) var(--tk-spacing-base-25, 4px)!important}:host ::ng-deep .tk-select-bottom{display:flex;justify-content:space-between;align-items:flex-start;margin-top:var(--tk-spacing-base-25, .25rem);min-height:var(--tk-spacing-base-125, 1.25rem)}:host ::ng-deep .tk-select-messages{flex:1;margin-right:var(--tk-spacing-base-100, 1rem)}:host ::ng-deep .tk-select-empty-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--tk-spacing-base-150, 1.5rem);text-align:center;color:var(--tk-color-base-surface-500, #8a8a8b)}:host ::ng-deep .tk-select-empty-container tk-icon{margin-bottom:var(--tk-spacing-base-50, .5rem)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { multiselectComponent: [{ type: i0.ViewChild, args: ['pMultiselect', { isSignal: true }] }], model: [{ type: i0.Input, args: [{ isSignal: true, alias: "model", required: false }] }, { type: i0.Output, args: ["modelChange"] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }, { type: i0.Output, args: ["dataSourceChange"] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], labelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelText", required: false }] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], maxSelectedLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxSelectedLabels", required: false }] }], selectedItemsLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedItemsLabel", required: false }] }], emptyFilterMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyFilterMessage", required: false }] }], filter: [{ type: i0.Input, args: [{ isSignal: true, alias: "filter", required: false }] }], filterPlaceHolder: [{ type: i0.Input, args: [{ isSignal: true, alias: "filterPlaceHolder", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], styleClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "styleClass", required: false }] }], errorMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "errorMessage", required: false }] }], hint: [{ type: i0.Input, args: [{ isSignal: true, alias: "hint", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], emptyMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyMessage", required: false }] }], fetchParams: [{ type: i0.Input, args: [{ isSignal: true, alias: "fetchParams", required: false }] }], sortField: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortField", required: false }] }], sortOrder: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortOrder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], selectionChange: [{ type: i0.Output, args: ["selectionChange"] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }] } });
 
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { MultiselectComponent };
+export { MultiselectComponent, TkMultiSelectManager };
 //# sourceMappingURL=tekus-design-system-components-multiselect.mjs.map

package/fesm2022/tekus-design-system-components-multiselect.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tekus-design-system-components-multiselect.mjs","sources":["../../../projects/design-system/components/multiselect/src/multiselect.component.ts","../../../projects/design-system/components/multiselect/src/multiselect.component.html","../../../projects/design-system/components/multiselect/tekus-design-system-components-multiselect.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  input,\n  model,\n  output,\n  signal,\n} from '@angular/core';\nimport {\n  ControlValueAccessor,\n  FormControl,\n  FormsModule,\n  NgControl,\n  ReactiveFormsModule,\n} from '@angular/forms';\nimport { MultiSelectModule } from 'primeng/multiselect';\nimport { FloatLabelModule } from 'primeng/floatlabel';\nimport { MultiSelectOption } from './multiselect.types';\nimport { MessageModule } from 'primeng/message';\n@Component({\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  selector: 'tk-multiselect',\n  imports: [\n    ReactiveFormsModule,\n    FormsModule,\n    MultiSelectModule,\n    FloatLabelModule,\n    MessageModule\n  ],\n  templateUrl: './multiselect.component.html',\n  styleUrl: './multiselect.component.scss',\n})\nexport class MultiselectComponent implements ControlValueAccessor {\n  readonly ngControl = inject(NgControl, { self: true, optional: true });\n\n  constructor() {\n    if (this.ngControl) {\n      this.ngControl.valueAccessor = this;\n    }\n  }\n\n  /**\n   * @property {Signal<MultiSelectOption[]>} selectionPool\n   * @description\n   * Internal signal to keep track of selected items even if they are filtered out from the main options list.\n   */\n  private readonly selectionPool = signal<MultiSelectOption[]>([]);\n\n  /**\n   * @property {ModelSignal<MultiSelectOption[] | null>} model\n   * @description\n   * The model signal for two-way binding.\n   */\n  readonly model = model<MultiSelectOption[] | null>([]);\n\n  /**\n   * @property {MultiSelectOption[]} options\n   * @description\n   * Array of available options shown in the multiselect dropdown.\n   */\n  options = input<MultiSelectOption[]>([]);\n\n  /**\n   * @property {string} labelText\n   * @description\n   * Label displayed above the multiselect input.\n   *\n   * @default 'Select'\n   */\n  labelText = input<string>('Select');\n\n  /**\n   * @property {string} display\n   * @description\n   * Display mode for selected items. Examples: 'chip', 'comma'.\n   *\n   * @default 'chip'\n   */\n  display = input<string>('chip');\n\n  /**\n   * @property {number} maxSelectedLabels\n   * @description\n   * Maximum number of labels shown when multiple items are selected.\n   *\n   * @default 4\n   */\n  maxSelectedLabels = input<number>(4);\n\n  /**\n   * @property {string} selectedItemsLabel\n   * @description\n   * Label template used when multiple items are selected (supports placeholders).\n   *\n   * @default '{0} elementos seleccionados'\n   */\n  selectedItemsLabel = input<string>('{0} elementos seleccionados');\n\n  /**\n   * @property {string} emptyFilterMessage\n   * @description\n   * Message displayed when the filter returns no results.\n   *\n   * @default 'No hay resultados'\n   */\n  emptyFilterMessage = input<string>('No hay resultados');\n\n  /**\n   * @property {boolean} filter\n   * @description\n   * Enables the search/filter input inside the multiselect dropdown.\n   *\n   * @default true\n   */\n  filter = input<boolean>(true);\n\n  /**\n   * @property {string} filterPlaceHolder\n   * @description\n   * Placeholder text for the filter input.\n   */\n  filterPlaceHolder = input<string>('');\n\n  /**\n   * @property {string} id\n   * @description\n   * HTML id attribute for the multiselect input.\n   *\n   * @default 'multiselect'\n   */\n  id = input<string>('multiselect');\n\n  /**\n   * @property {string} styleClass\n   * @description\n   * Additional CSS class applied to the multiselect container.\n   */\n  styleClass = input<string>('');\n\n    /**\n   * @property {InputSignal<string>} errorMessage\n   * @description\n   * Message to display when the control is invalid and touched.\n   */\n  errorMessage = input<string>('');\n\n    /**\n   * @property {InputSignal<string>} hint\n   * @description\n   * Hint text to display below the input.\n   */\n  hint = input<string>('');\n\n  /**\n   * @event selectionChange\n   * @description\n   * Emits when the selected options change.\n   * Payload: an array of selected MultiSelectOption or null.\n   *\n   * @example\n   * <tk-multiselect (selectionChange)=\"onChange($event)\"></tk-multiselect>\n   */\n  selectionChange = output<MultiSelectOption[] | null>();\n\n  /**\n   * @event filterChange\n   * @description\n   * Emits the filter text when the user types in the search input.\n   */\n  readonly filterChange = output<string>();\n\n  /**\n   * @property internalOptions\n   * @description\n   * Computed signal that merges the current options with the selected items pool\n   * to ensure selected items are always visible.\n   */\n  readonly internalOptions = computed(() => {\n    const currentFromParent = this.options();\n    const selected = this.selectionPool();\n\n    const merged = [...selected, ...currentFromParent];\n    const uniqueMap = new Map();\n\n    merged.forEach(item => {\n      if (item) uniqueMap.set(item.code, item);\n    });\n\n    return Array.from(uniqueMap.values());\n  });\n\n  /**\n   * @method handleFilter\n   * @description\n   * Handles the filter event from the PrimeNG component and emits the filter value.\n   *\n   * @param event - The filter event object.\n   */\n  handleFilter(event: { filter: string }) {\n    this.filterChange.emit(event.filter || '');\n  }\n\n  /**\n   * @callback onChange\n   * @description\n   * Callback function to notify the parent component of value changes.\n   */\n  onChange: (value: MultiSelectOption[] | null) => void = () => {};\n\n  /**\n   * @callback onTouched\n   * @description\n   * Callback function to notify the parent component when the control is touched.\n   */\n  onTouched: () => void = () => {};\n\n  /**\n   * @method handleChange\n   * @description\n   * Handler forwarded from the PrimeNG MultiSelect change event.\n   * Emits the selectionChange output with the selected values.\n   *\n   * @param event - Change event containing the `value` property with selected items.\n   */\n  handleChange(event: { value: MultiSelectOption[] | null }): void {\n    const val = event.value || [];\n    this.model.set(val);\n    this.updateSelectionPool(val);\n\n    this.onChange(val);\n    this.selectionChange.emit(val);\n\n    if (this.effectiveControl) {\n      this.effectiveControl.setValue(val);\n      this.effectiveControl.markAsDirty();\n      this.effectiveControl.markAsTouched();\n    }\n  }\n\n  /**\n   * @method updateSelectionPool\n   * @description\n   * Updates the internal selection pool to ensure selected items persist\n   * even if they are filtered out from the main options list.\n   *\n   * @param items - The items to add to the pool.\n   */\n  private updateSelectionPool(items: MultiSelectOption[]) {\n    this.selectionPool.update(prev => {\n      const combined = [...prev, ...items];\n      const map = new Map();\n      combined.forEach(i => map.set(i.code, i));\n      return Array.from(map.values());\n    });\n  }\n\n  /**\n   * @method writeValue\n   * @description\n   * Writes a new value to the element.\n   * Part of the ControlValueAccessor interface.\n   *\n   * @param value - The new value.\n   */\n  writeValue(value: MultiSelectOption[] | null): void {\n    this.model.set(value || []);\n    if (value) this.updateSelectionPool(value);\n  }\n\n  /**\n   * @method registerOnChange\n   * @description\n   * Registers a callback function that is called when the control's value changes in the UI.\n   * Part of the ControlValueAccessor interface.\n   *\n   * @param fn - The callback function.\n   */\n  registerOnChange(fn: (value: MultiSelectOption[] | null) => void): void {\n    this.onChange = fn;\n  }\n\n  /**\n   * @method registerOnTouched\n   * @description\n   * Registers a callback function that is called by the forms API on initialization to update the form control on 'blur'.\n   * Part of the ControlValueAccessor interface.\n   *\n   * @param fn - The callback function.\n   */\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  /**\n   * @method effectiveControl\n   * @description\n   * Gets the effective FormControl associated with this component,\n   * either from NgControl or the internal model.\n   */\n  get effectiveControl(): FormControl | null {\n    return (this.ngControl?.control as FormControl) || null;\n  }\n}\n","<p-floatlabel>\n  <p-multiselect\n    optionLabel=\"name\"\n    [id]=\"id()\"\n    [options]=\"options()\"\n    [(ngModel)]=\"model\"\n    [display]=\"display()\"\n    [maxSelectedLabels]=\"maxSelectedLabels()\"\n    [selectedItemsLabel]=\"selectedItemsLabel()\"\n    [emptyFilterMessage]=\"emptyFilterMessage()\"\n    [filter]=\"filter()\"\n    [filterPlaceHolder]=\"filterPlaceHolder()\"\n    [styleClass]=\"styleClass()\"\n    [class.ng-invalid]=\"\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched)\n    \"\n    [class.ng-dirty]=\"effectiveControl?.dirty\"\n    [class.ng-touched]=\"effectiveControl?.touched\"\n    (onFilter)=\"handleFilter($event)\"\n    (onChange)=\"handleChange($event)\">\n  </p-multiselect>\n  <label [for]=\"id()\">{{ labelText() }}</label>\n</p-floatlabel>\n\n<div class=\"tk-select-bottom\">\n  <div class=\"tk-select-messages\">\n    @if (\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched) &&\n      errorMessage()\n    ) {\n      <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n        errorMessage()\n      }}</p-message>\n    } @else if (hint()) {\n      <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{\n        hint()\n      }}</p-message>\n    }\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"tekus-design-system-components-multiselect.mjs","sources":["../../../projects/design-system/components/multiselect/src/multiselect.manager.ts","../../../projects/design-system/components/multiselect/src/multiselect.component.ts","../../../projects/design-system/components/multiselect/src/multiselect.component.html","../../../projects/design-system/components/multiselect/tekus-design-system-components-multiselect.ts"],"sourcesContent":["import { Injectable, signal } from '@angular/core';\nimport { toObservable, toSignal } from '@angular/core/rxjs-interop';\nimport {\n  auditTime,\n  combineLatest,\n  debounceTime,\n  distinctUntilChanged,\n  map,\n  Observable,\n  of,\n  scan,\n  switchMap,\n  tap,\n} from 'rxjs';\nimport { MultiSelectOption } from './multiselect.types';\n\n/**\n * Standard request object for fetching data from an asynchronous source.\n * Aligned with PrimeNG LazyLoadEvent patterns.\n */\nexport interface TkMultiSelectRequest {\n  filter: string;\n  page: number;\n  pageSize: number;\n  sortField?: string;\n  sortOrder?: number;\n  params?: Record<string, unknown>;\n}\n\n/**\n * Interface representing the data source for the Multiselect manager.\n */\nexport interface MultiSelectDataSource<T = MultiSelectOption> {\n  fetch(request: TkMultiSelectRequest): Observable<T[]>;\n}\n\n@Injectable()\nexport class TkMultiSelectManager<T = MultiSelectOption> {\n  /**\n   * Reactive signal for the current search query.\n   */\n  searchQuery = signal<string>('');\n\n  /**\n   * Reactive signal for the current pagination page.\n   */\n  page = signal<number>(1);\n\n  /**\n   * Data source provider for fetching items.\n   */\n  public dataSource: MultiSelectDataSource<T> | undefined;\n\n  /**\n   * Additional parameters to send to the data source.\n   */\n  fetchParams = signal<Record<string, unknown>>({});\n\n  /**\n   * Sorting field.\n   */\n  sortField = signal<string | undefined>(undefined);\n\n  /**\n   * Sorting order (1 for ASC, -1 for DESC).\n   */\n  sortOrder = signal<number | undefined>(undefined);\n\n  /**\n   * Reactive signal indicating if data is currently being fetched.\n   */\n  loading = signal<boolean>(false);\n\n  /**\n   * Reactive signal indicating if there are more items to fetch.\n   */\n  hasMore = signal<boolean>(true);\n\n  /**\n   * Number of items per page to detect the end of data.\n   */\n  pageSize = 20;\n\n  /**\n   * Final accumulated list of items exposed as a Signal.\n   */\n  items = toSignal(\n    combineLatest({\n      filter: toObservable(this.searchQuery).pipe(debounceTime(200)),\n      page: toObservable(this.page),\n      params: toObservable(this.fetchParams),\n      sortField: toObservable(this.sortField),\n      sortOrder: toObservable(this.sortOrder),\n    }).pipe(\n      auditTime(0),\n      distinctUntilChanged(\n        (prev, curr) => JSON.stringify(prev) === JSON.stringify(curr)\n      ),\n      map((data) => ({ ...data, pageSize: this.pageSize }) as TkMultiSelectRequest),\n      tap((request) => {\n        if (request.page === 1) {\n          this.hasMore.set(true);\n        }\n        this.loading.set(true);\n      }),\n      switchMap(\n        (request: TkMultiSelectRequest): Observable<{ results: T[]; page: number }> => {\n          const fetcher$ = this.dataSource\n            ? this.dataSource.fetch(request)\n            : of([] as T[]);\n\n          return fetcher$.pipe(\n            tap((results) => {\n              if (results.length < this.pageSize) {\n                this.hasMore.set(false);\n              }\n            }),\n            map((results) => ({ results, page: request.page })),\n            tap(() => this.loading.set(false))\n          );\n        }\n      ),\n      scan((acc: T[], { results, page }: { results: T[]; page: number }) => {\n        return page === 1 ? results : [...acc, ...results];\n      }, [] as T[])\n    ),\n    { initialValue: [] as T[] }\n  );\n\n  /**\n   * Updates the search query and resets pagination.\n   * @param query - The new search string.\n   */\n  updateSearch(query: string): void {\n    if (this.searchQuery() !== query) {\n      this.searchQuery.set(query);\n      this.page.set(1);\n      this.hasMore.set(true);\n    }\n  }\n\n  /**\n   * Increments the page to trigger the next data chunk.\n   */\n  loadNextPage(): void {\n    this.page.update((p) => p + 1);\n  }\n\n  /**\n   * Configures the data provider for the manager.\n   * @param provider - Object implementing the MultiSelectDataSource interface.\n   */\n  setDataSource(provider: MultiSelectDataSource<T>): void {\n    this.dataSource = provider;\n  }\n\n  /**\n   * Updates additional fetch parameters and resets pagination.\n   * @param params - The new parameters object.\n   */\n  updateParams(params: Record<string, unknown>): void {\n    if (JSON.stringify(this.fetchParams()) !== JSON.stringify(params)) {\n      this.fetchParams.set(params);\n      this.page.set(1);\n      this.hasMore.set(true);\n    }\n  }\n\n  /**\n   * Resets the manager state to its initial values.\n   */\n  reset(): void {\n    this.searchQuery.set('');\n    this.page.set(1);\n    this.hasMore.set(true);\n  }\n}\n","import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  inject,\n  input,\n  model,\n  output,\n  signal,\n  effect,\n  OnDestroy,\n  viewChild,\n} from '@angular/core';\nimport {\n  ControlValueAccessor,\n  FormControl,\n  FormsModule,\n  NgControl,\n  ReactiveFormsModule,\n} from '@angular/forms';\nimport { MultiSelect, MultiSelectModule } from 'primeng/multiselect';\nimport { FloatLabelModule } from 'primeng/floatlabel';\nimport { MultiSelectOption } from './multiselect.types';\nimport { MessageModule } from 'primeng/message';\nimport { IconComponent } from '@tekus/design-system/components/icon';\nimport { TkMultiSelectManager, MultiSelectDataSource } from './multiselect.manager';\n\n@Component({\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  selector: 'tk-multiselect',\n  providers: [TkMultiSelectManager],\n  imports: [\n    ReactiveFormsModule,\n    FormsModule,\n    MultiSelectModule,\n    FloatLabelModule,\n    MessageModule,\n    IconComponent,\n  ],\n  templateUrl: './multiselect.component.html',\n  styleUrl: './multiselect.component.scss',\n})\nexport class MultiselectComponent implements ControlValueAccessor, OnDestroy {\n  readonly ngControl = inject(NgControl, { self: true, optional: true });\n  readonly manager = inject(TkMultiSelectManager<MultiSelectOption>);\n\n  /** PrimeNG MultiSelect instance */\n  readonly multiselectComponent = viewChild<MultiSelect>('pMultiselect');\n\n  constructor() {\n    if (this.ngControl) {\n      this.ngControl.valueAccessor = this;\n    }\n\n    // Synchronize parameters with the manager\n    effect(() => {\n      this.manager.updateParams(this.fetchParams());\n    });\n\n    effect(() => {\n      this.manager.sortField.set(this.sortField());\n      this.manager.sortOrder.set(this.sortOrder());\n    });\n\n    // Synchronize disabled state\n    effect(() => {\n      this.internalDisabled.set(this.disabled());\n    });\n\n    // Synchronize data source\n    effect(() => {\n      const source = this.dataSource();\n      if (source) {\n        this.manager.setDataSource(source);\n      }\n    });\n  }\n\n  /**\n   * @property {Signal<MultiSelectOption[]>} selectionPool\n   * @description\n   * Internal signal to keep track of selected items even if they are filtered out from the main options list.\n   */\n  private readonly selectionPool = signal<MultiSelectOption[]>([]);\n\n  /**\n   * @property {ModelSignal<MultiSelectOption[] | null>} model\n   * @description\n   * The model signal for two-way binding.\n   */\n  readonly model = model<MultiSelectOption[] | null>([]);\n\n  /**\n   * Data source for asynchronous infinite scroll mode.\n   */\n  readonly dataSource = model<MultiSelectDataSource<MultiSelectOption>>();\n\n  /**\n   * @property {MultiSelectOption[]} options\n   * @description\n   * Array of available options shown in the multiselect dropdown.\n   */\n  options = input<MultiSelectOption[]>([]);\n\n  /**\n   * @property {string} labelText\n   * @description\n   * Label displayed above the multiselect input.\n   *\n   * @default 'Select'\n   */\n  labelText = input<string>('Select');\n\n  /**\n   * @property {string} display\n   * @description\n   * Display mode for selected items. Examples: 'chip', 'comma'.\n   *\n   * @default 'chip'\n   */\n  display = input<string>('chip');\n\n  /**\n   * @property {number} maxSelectedLabels\n   * @description\n   * Maximum number of labels shown when multiple items are selected.\n   *\n   * @default 4\n   */\n  maxSelectedLabels = input<number>(4);\n\n  /**\n   * @property {string} selectedItemsLabel\n   * @description\n   * Label template used when multiple items are selected (supports placeholders).\n   *\n   * @default '{0} elementos seleccionados'\n   */\n  selectedItemsLabel = input<string>('{0} elementos seleccionados');\n\n  /**\n   * @property {string} emptyFilterMessage\n   * @description\n   * Message displayed when the filter returns no results.\n   *\n   * @default 'No hay resultados'\n   */\n  emptyFilterMessage = input<string>('No hay resultados');\n\n  /**\n   * @property {boolean} filter\n   * @description\n   * Enables the search/filter input inside the multiselect dropdown.\n   *\n   * @default true\n   */\n  filter = input<boolean>(true);\n\n  /**\n   * @property {string} filterPlaceHolder\n   * @description\n   * Placeholder text for the filter input.\n   */\n  filterPlaceHolder = input<string>('');\n\n  /**\n   * @property {string} id\n   * @description\n   * HTML id attribute for the multiselect input.\n   *\n   * @default 'multiselect'\n   */\n  id = input<string>('multiselect');\n\n  /**\n   * @property {string} styleClass\n   * @description\n   * Additional CSS class applied to the multiselect container.\n   */\n  styleClass = input<string>('');\n\n  /**\n   * @property {InputSignal<string>} errorMessage\n   * @description\n   * Message to display when the control is invalid and touched.\n   */\n  errorMessage = input<string>('');\n\n  /**\n   * @property {InputSignal<string>} hint\n   * @description\n   * Hint text to display below the input.\n   */\n  hint = input<string>('');\n\n  /**\n   * Loading state for the dropdown.\n   */\n  loading = input<boolean>(false);\n\n  /**\n   * Text to display when there are no options.\n   */\n  emptyMessage = input<string>('No data available');\n\n  /**\n   * Additional parameters for the async data source.\n   * Useful for sending context like categoryId, parentId, etc.\n   */\n  fetchParams = input<Record<string, unknown>>({});\n\n  /**\n   * Field name to sort by in the async data source.\n   */\n  sortField = input<string | undefined>(undefined);\n\n  /**\n   * Order to sort by (1 for ASC, -1 for DESC).\n   */\n  sortOrder = input<number | undefined>(undefined);\n\n  /**\n   * Determines whether the select field is disabled.\n   * @default false\n   */\n  disabled = input<boolean>(false);\n\n  /**\n   * Internal writable signal for the disabled state.\n   */\n  readonly internalDisabled = signal<boolean>(false);\n\n  /**\n   * @event selectionChange\n   * @description\n   * Emits when the selected options change.\n   * Payload: an array of selected MultiSelectOption or null.\n   *\n   * @example\n   * <tk-multiselect (selectionChange)=\"onChange($event)\"></tk-multiselect>\n   */\n  selectionChange = output<MultiSelectOption[] | null>();\n\n  /**\n   * @event filterChange\n   * @description\n   * Emits the filter text when the user types in the search input.\n   */\n  readonly filterChange = output<string>();\n\n  private readonly scrollHandler = this.handleScroll.bind(this);\n  private lastListContainer: HTMLElement | null = null;\n\n  /**\n   * @property internalOptions\n   * @description\n   * Computed signal that merges the current options with the selected items pool\n   * to ensure selected items are always visible.\n   */\n  readonly internalOptions = computed(() => {\n    const currentFromParent = this.dataSource()\n      ? (this.manager.items() as MultiSelectOption[])\n      : this.options();\n    const selected = this.selectionPool();\n\n    const merged = [...selected, ...currentFromParent];\n    const uniqueMap = new Map();\n\n    merged.forEach((item) => {\n      if (item) uniqueMap.set(item.code, item);\n    });\n\n    return Array.from(uniqueMap.values());\n  });\n\n  /**\n   * @method handleFilter\n   * @description\n   * Handles the filter event from the PrimeNG component and emits the filter value.\n   *\n   * @param event - The filter event object.\n   */\n  handleFilter(event: { filter: string }) {\n    const query = event.filter || '';\n    if (this.dataSource()) {\n      this.manager.updateSearch(query);\n    }\n    this.filterChange.emit(query);\n  }\n\n  /**\n   * @callback onChange\n   * @description\n   * Callback function to notify the parent component of value changes.\n   */\n  onChange: (value: MultiSelectOption[] | null) => void = () => { };\n\n  /**\n   * @callback onTouched\n   * @description\n   * Callback function to notify the parent component when the control is touched.\n   */\n  onTouched: () => void = () => { };\n\n  /**\n   * @method handleChange\n   * @description\n   * Handler forwarded from the PrimeNG MultiSelect change event.\n   * Emits the selectionChange output with the selected values.\n   *\n   * @param event - Change event containing the `value` property with selected items.\n   */\n  handleChange(event: { value: MultiSelectOption[] | null }): void {\n    const val = event.value || [];\n    this.model.set(val);\n    this.updateSelectionPool(val);\n\n    this.onChange(val);\n    this.selectionChange.emit(val);\n\n    if (this.effectiveControl) {\n      this.effectiveControl.setValue(val);\n      this.effectiveControl.markAsDirty();\n      this.effectiveControl.markAsTouched();\n    }\n  }\n\n  /**\n   * @method updateSelectionPool\n   * @description\n   * Updates the internal selection pool to ensure selected items persist\n   * even if they are filtered out from the main options list.\n   *\n   * @param items - The items to add to the pool.\n   */\n  private updateSelectionPool(items: MultiSelectOption[]) {\n    this.selectionPool.update((prev) => {\n      const combined = [...prev, ...items];\n      const map = new Map();\n      combined.forEach((i) => map.set(i.code, i));\n      return Array.from(map.values());\n    });\n  }\n\n  /**\n   * @method writeValue\n   * @description\n   * Writes a new value to the element.\n   * Part of the ControlValueAccessor interface.\n   *\n   * @param value - The new value.\n   */\n  writeValue(value: MultiSelectOption[] | null): void {\n    this.model.set(value || []);\n    if (value) this.updateSelectionPool(value);\n  }\n\n  /**\n   * @method registerOnChange\n   * @description\n   * Registers a callback function that is called when the control's value changes in the UI.\n   * Part of the ControlValueAccessor interface.\n   *\n   * @param fn - The callback function.\n   */\n  registerOnChange(fn: (value: MultiSelectOption[] | null) => void): void {\n    this.onChange = fn;\n  }\n\n  /**\n   * @method registerOnTouched\n   * @description\n   * Registers a callback function that is called by the forms API on initialization to update the form control on 'blur'.\n   * Part of the ControlValueAccessor interface.\n   *\n   * @param fn - The callback function.\n   */\n  registerOnTouched(fn: () => void): void {\n    this.onTouched = fn;\n  }\n\n  /**\n   * Updates the disabled state of the control.\n   * @param isDisabled - Whether the component should be disabled.\n   */\n  setDisabledState(isDisabled: boolean): void {\n    this.internalDisabled.set(isDisabled);\n  }\n\n  /**\n   * Adds a scroll listener to the PrimeNG multiselect list container when the panel opens.\n   */\n  onPanelShow(): void {\n    const listContainer = document.querySelector('.p-multiselect-list-container') as HTMLElement;\n    if (listContainer) {\n      this.lastListContainer = listContainer;\n      listContainer.addEventListener('scroll', this.scrollHandler);\n    }\n  }\n\n  /**\n   * Cleans up state, removes listeners and resets the manager when the panel closes.\n   */\n  onPanelHide(): void {\n    this.removeScrollListener();\n    this.manager.reset();\n  }\n\n  /**\n   * Cleans up listeners on component destruction.\n   */\n  ngOnDestroy(): void {\n    this.removeScrollListener();\n  }\n\n  /**\n   * Safely removes the scroll event listener.\n   */\n  private removeScrollListener(): void {\n    if (this.lastListContainer) {\n      this.lastListContainer.removeEventListener('scroll', this.scrollHandler);\n      this.lastListContainer = null;\n    }\n  }\n\n  /**\n   * Detects if the user has reached the bottom of the list.\n   */\n  private handleScroll(event: Event): void {\n    const target = event.target as HTMLElement;\n    if (!target) return;\n\n    // Trigger near the bottom (1px threshold)\n    const atBottom =\n      target.scrollHeight - target.scrollTop <= target.clientHeight + 1;\n\n    if (\n      atBottom &&\n      this.manager.dataSource &&\n      !this.manager.loading() &&\n      this.manager.hasMore()\n    ) {\n      this.manager.loadNextPage();\n    }\n  }\n\n  /**\n   * @method effectiveControl\n   * @description\n   * Gets the effective FormControl associated with this component,\n   * either from NgControl or the internal model.\n   */\n  get effectiveControl(): FormControl | null {\n    return (this.ngControl?.control as FormControl) || null;\n  }\n}\n","<p-floatlabel>\n  <p-multiselect\n    #pMultiselect\n    optionLabel=\"name\"\n    [id]=\"id()\"\n    [options]=\"internalOptions()\"\n    [(ngModel)]=\"model\"\n    [display]=\"display()\"\n    [maxSelectedLabels]=\"maxSelectedLabels()\"\n    [selectedItemsLabel]=\"selectedItemsLabel()\"\n    [emptyFilterMessage]=\"emptyFilterMessage()\"\n    [filter]=\"filter()\"\n    [filterPlaceHolder]=\"filterPlaceHolder()\"\n    [styleClass]=\"styleClass()\"\n    [loading]=\"loading() || (dataSource() ? manager.loading() : false)\"\n    [disabled]=\"disabled() || internalDisabled()\"\n    [emptyMessage]=\"emptyMessage()\"\n    [class.ng-invalid]=\"\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched)\n    \"\n    [class.ng-dirty]=\"effectiveControl?.dirty\"\n    [class.ng-touched]=\"effectiveControl?.touched\"\n    (onFilter)=\"handleFilter($event)\"\n    (onChange)=\"handleChange($event)\"\n    (onPanelShow)=\"onPanelShow()\"\n    (onPanelHide)=\"onPanelHide()\"\n    [resetFilterOnHide]=\"true\">\n\n    <ng-template pTemplate=\"empty\">\n      <div class=\"tk-select-empty-container\">\n        <tk-icon icon=\"info\" size=\"2xl\"></tk-icon>\n        <span>{{ emptyMessage() }}</span>\n      </div>\n    </ng-template>\n\n    <ng-template pTemplate=\"emptyfilter\">\n      <div class=\"tk-select-empty-container\">\n        <tk-icon icon=\"magnifying-glass\" size=\"2xl\"></tk-icon>\n        <span>{{ emptyFilterMessage() }}</span>\n      </div>\n    </ng-template>\n  </p-multiselect>\n  <label [for]=\"id()\">{{ labelText() }}</label>\n</p-floatlabel>\n\n<div class=\"tk-select-bottom\">\n  <div class=\"tk-select-messages\">\n    @if (\n      effectiveControl?.invalid &&\n      (effectiveControl?.dirty || effectiveControl?.touched) &&\n      errorMessage()\n    ) {\n      <p-message severity=\"error\" size=\"small\" variant=\"simple\">{{\n        errorMessage()\n      }}</p-message>\n    } @else if (hint()) {\n      <p-message severity=\"secondary\" size=\"small\" variant=\"simple\">{{\n        hint()\n      }}</p-message>\n    }\n  </div>\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/tekus-design-system-components-select.mjs

@@ -335,7 +335,7 @@ class SelectComponent {
      * Returns the underlying FormControl for validation state checking.
      */
     get effectiveControl() {
-        return this.ngControl?.control || null;
+        return this.ngControl?.control || this.control() || null;
     }
     /**
      * Adds a scroll listener to the PrimeNG select list container when the panel opens.