@updevs/components 1.0.0-alpha.5 → 1.0.0-alpha.8

package/fesm2022/updevs-components-form-controls-select.mjs

@@ -0,0 +1,371 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, inject, Renderer2, NgZone, RendererStyleFlags2, ElementRef, Directive, HostBinding, ViewChild, Input, Output, Component, ViewEncapsulation, NgModule } from '@angular/core';
+import { BaseComponent, DomEventsService, PositioningService, UpdCoreLayoutModule } from '@updevs/sdk/layout';
+import { Tools } from '@updevs/sdk/core';
+import { SearchRequestModel } from '@updevs/sdk/stores';
+import { Subject, tap, debounceTime } from 'rxjs';
+import * as i1 from '@updevs/components/list';
+import { UpdListModule } from '@updevs/components/list';
+import * as i2 from '@updevs/components/form-controls/input';
+import { UpdInputModule } from '@updevs/components/form-controls/input';
+import * as i3 from '@updevs/icons';
+import { UpdIconsModule } from '@updevs/icons';
+import * as i4 from '@updevs/components/button';
+import { UpdButtonModule } from '@updevs/components/button';
+import { CommonModule } from '@angular/common';
+import { TranslocoModule } from '@ngneat/transloco';
+
+var Utils = Tools.Utils;
+class BaseSelectComponent extends BaseComponent {
+    constructor() {
+        super(...arguments);
+        this.wrapperClasses = '';
+        /**
+         * Placeholder.
+         */
+        this.placeholder = '';
+        /**
+         * Maximum height of the dropdown.
+         */
+        this.dropdownMaxHeight = 300;
+        this.typeaheadDebounce = 200;
+        this.shouldAutoSearch = true;
+        this.shouldCloseOnOutsideClick = true;
+        this.dropdownOpenStatusChange = new EventEmitter();
+        this.isLoading = false;
+        this.localItems = [];
+        this.listItems = [];
+        this.dropdownClasses = 'select-dropdown-content remove-top-radius';
+        this._localBackupItems = [];
+        this.isStaticList = false;
+        this._isDropdownOpen = false;
+        this.searchInputSubject = new Subject();
+        this.renderer = inject(Renderer2);
+        this.ngZone = inject(NgZone);
+        this.domEventsService = inject(DomEventsService);
+        this.positioningService = inject(PositioningService);
+    }
+    get isDropdownOpen() {
+        return this._isDropdownOpen;
+    }
+    set isDropdownOpen(value) {
+        this._isDropdownOpen = value;
+        this.dropdownOpenStatusChange.emit(value);
+        if (value) {
+            this.dropdownClasses += ' select-dropdown-content-open';
+        }
+        else {
+            this.dropdownClasses = this.dropdownClasses.replace(' select-dropdown-content-open', '');
+        }
+    }
+    ngOnInit() {
+        this.isStaticList = (this.items?.length || 0) > 0;
+        if (this.shouldAutoSearch) {
+            if (this.isStaticList) {
+                this._setupLocalItems(this.items);
+            }
+            else {
+                this.searchRemote();
+            }
+        }
+        if (this.isStaticList) {
+            return;
+        }
+        const typeaheadSubscription = this.searchInputSubject
+            .pipe(tap(value => this._currentTerm = value), debounceTime(this.typeaheadDebounce))
+            .subscribe(() => this.searchRemote());
+        this.addSubscriptions(typeaheadSubscription);
+    }
+    openDropdown() {
+        this.isDropdownOpen = true;
+        if (this.shouldCloseOnOutsideClick) {
+            const outsideClickSub = this.domEventsService.startOutsideClickListener(() => this.ngZone.run(() => this.isDropdownOpen = false), this.list?.nativeElement, true, this.componentBox?.nativeElement, this.searchBox?.nativeElement);
+            this.addSubscriptions(outsideClickSub);
+        }
+        this.ngZone.runOutsideAngular(() => this.positioningService
+            .computePosition(this.componentBox, this.list, { placement: 'bottom' })
+            .subscribe(resp => this.updatePosition(resp)));
+    }
+    search(term) {
+        if (this.isStaticList) {
+            this.searchLocal();
+        }
+        else {
+            this.searchInputSubject.next(term || '');
+        }
+    }
+    _setupLocalItems(items) {
+        this.localItems = Utils.deepCopy(items);
+        this._localBackupItems = Utils.deepCopy(items);
+        const tempItems = [];
+        for (const item of this._localBackupItems) {
+            let listItem = this.getListItem(item);
+            item.listItem = Object.assign(listItem, {});
+            tempItems.push(listItem);
+        }
+        this.listItems = [...tempItems];
+        this.isLoading = false;
+    }
+    searchLocal() {
+        if (!this._currentTerm) {
+            this.listItems = Utils.deepCopy(this._localBackupItems.map(li => li.listItem));
+            this.localItems = Utils.deepCopy(this._localBackupItems);
+            return;
+        }
+        this.ngZone.run(() => {
+            this.listItems = Utils.deepCopy(this._localBackupItems).filter(si => {
+                let hasChildrenInSearch = false;
+                if ((si.children?.length || 0) > 0) {
+                    hasChildrenInSearch = si.children.filter(ci => ci.text.toLowerCase().includes(this._currentTerm.toLowerCase())).length > 0;
+                }
+                return si.text.toLowerCase().includes(this._currentTerm.toLowerCase()) || hasChildrenInSearch;
+            }).map(si => {
+                const bkpItem = this._localBackupItems.find(lbi => lbi.value === si.value);
+                if ((bkpItem?.children?.length || 0) > 0) {
+                    si.children = [...bkpItem.children].filter(ci => ci.text.toLowerCase().includes(this._currentTerm.toLowerCase()));
+                }
+                return this.getListItem(si);
+            });
+        });
+    }
+    searchRemote() {
+        this.isLoading = true;
+        const request = new SearchRequestModel({ description: this._currentTerm });
+        const observable = !!this.observable ? this.observable(request) : this.store.search(request);
+        observable.subscribe(r => {
+            const items = [];
+            r.records.forEach(item => {
+                items.push({
+                    value: item[this.itemKey],
+                    text: item[this.itemValue],
+                    objectData: item
+                });
+            });
+            this._setupLocalItems(items);
+        });
+    }
+    getListItem(item) {
+        let listItem;
+        if (!!item.listItem) {
+            listItem = item.listItem;
+            listItem.id = item.value;
+            listItem.text = item.text;
+        }
+        else {
+            listItem = {
+                id: item.value,
+                text: item.text
+            };
+        }
+        if ((item.children?.length || 0) > 0) {
+            listItem.children = [...item.children].map(c => this.getListItem(c));
+        }
+        return listItem;
+    }
+    updatePosition(result) {
+        const componentBox = this.componentBox.nativeElement.getBoundingClientRect();
+        const searchBoxChildElement = this.searchBoxChild?.nativeElement;
+        const ddElement = this.list.nativeElement;
+        this.renderer.setStyle(searchBoxChildElement, 'width', `${Math.abs(componentBox.width)}px`, RendererStyleFlags2.Important);
+        this.renderer.setStyle(ddElement, 'top', `${result.y + searchBoxChildElement.scrollHeight}px`, RendererStyleFlags2.Important);
+        this.renderer.setStyle(ddElement, 'left', 0, RendererStyleFlags2.Important);
+        this.renderer.setStyle(ddElement, 'width', `${Math.abs(componentBox.width)}px`, RendererStyleFlags2.Important);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: BaseSelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.0.1", type: BaseSelectComponent, inputs: { items: "items", store: "store", observable: "observable", itemKey: "itemKey", itemValue: "itemValue", label: "label", placeholder: "placeholder", dropdownMaxHeight: "dropdownMaxHeight", typeaheadDebounce: "typeaheadDebounce", shouldAutoSearch: "shouldAutoSearch", shouldCloseOnOutsideClick: "shouldCloseOnOutsideClick" }, outputs: { dropdownOpenStatusChange: "dropdownOpenStatusChange" }, host: { properties: { "class": "this.wrapperClasses" } }, viewQueries: [{ propertyName: "componentBox", first: true, predicate: ["componentBox"], descendants: true, read: ElementRef }, { propertyName: "searchBox", first: true, predicate: ["searchBox"], descendants: true, read: ElementRef }, { propertyName: "searchBoxChild", first: true, predicate: ["searchBoxChild"], descendants: true, read: ElementRef }, { propertyName: "list", first: true, predicate: ["list"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: BaseSelectComponent, decorators: [{
+            type: Directive
+        }], propDecorators: { wrapperClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }], componentBox: [{
+                type: ViewChild,
+                args: ['componentBox', { read: ElementRef }]
+            }], searchBox: [{
+                type: ViewChild,
+                args: ['searchBox', { read: ElementRef }]
+            }], searchBoxChild: [{
+                type: ViewChild,
+                args: ['searchBoxChild', { read: ElementRef }]
+            }], list: [{
+                type: ViewChild,
+                args: ['list', { read: ElementRef }]
+            }], items: [{
+                type: Input
+            }], store: [{
+                type: Input
+            }], observable: [{
+                type: Input
+            }], itemKey: [{
+                type: Input
+            }], itemValue: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], placeholder: [{
+                type: Input
+            }], dropdownMaxHeight: [{
+                type: Input
+            }], typeaheadDebounce: [{
+                type: Input
+            }], shouldAutoSearch: [{
+                type: Input
+            }], shouldCloseOnOutsideClick: [{
+                type: Input
+            }], dropdownOpenStatusChange: [{
+                type: Output
+            }] } });
+
+class SelectComponent extends BaseSelectComponent {
+    constructor() {
+        super(...arguments);
+        /**
+         * If true, it'll use the default style of the OS, no search capabilities.
+         */
+        this.useSystemStyle = false;
+        /**
+         * Triggered when an item is selected.
+         */
+        this.selectedItem = new EventEmitter();
+    }
+    onSelectItem(item) {
+        this._currentTerm = item.text;
+        this.isDropdownOpen = false;
+        for (const localBackupItem of this._localBackupItems) {
+            if ((localBackupItem.children?.length || 0) > 0) {
+                this.currentSelection = localBackupItem.children?.find(c => c.value === item.id);
+                if (!!this.currentSelection) {
+                    break;
+                }
+            }
+            else if (localBackupItem.value === item.id) {
+                this.currentSelection = localBackupItem;
+                break;
+            }
+        }
+        this.selectedItem.emit(this.currentSelection);
+    }
+    clearSelection() {
+        this.currentSelection = undefined;
+        this._currentTerm = undefined;
+        this.search();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: SelectComponent, selector: "upd-select", inputs: { useSystemStyle: "useSystemStyle" }, outputs: { selectedItem: "selectedItem" }, usesInheritance: true, ngImport: i0, template: "@if (!!label) {\n    <label class=\"form-label\">{{ label }}</label>\n}\n\n@if (!useSystemStyle) {\n    <div class=\"dropdown\">\n        <div #componentBox class=\"input-group input-group-flat\">\n            <div class=\"form-control\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n                @if (!!currentSelection) {\n                    <span>{{ currentSelection.text }}</span>\n                }\n            </div>\n            <div class=\"input-group-text\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n                @if (!!currentSelection) {\n                    <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"clearSelection()\" customClasses=\"link-secondary\">\n                        <upd-icon [model]=\"{heroIcon:'x-mark', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                    </upd-button>\n                }\n                @if (!isLoading) {\n                    <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"openDropdown()\" customClasses=\"link-secondary ms-2\">\n                        <upd-icon [model]=\"{heroIcon:'chevron-down', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                    </upd-button>\n                } @else {\n                    <div class=\"select-loader-wrapper\">\n                        <div class=\"spinner-border spinner-border-sm text-muted select-loader\" role=\"status\"></div>\n                    </div>\n                }\n            </div>\n        </div>\n        <div #searchBox>\n            <div #searchBoxChild [style.visibility]=\"isDropdownOpen ? 'visible' : 'hidden'\" class=\"select-search-box\">\n                <upd-input [placeholder]=\"placeholder\" [isInputGroupFlat]=\"true\" (click)=\"openDropdown()\" (valueChange)=\"search($event)\">\n                    <ng-template updInputPrepend>\n                        <upd-icon [model]=\"{heroIcon:'magnifying-glass'}\"></upd-icon>\n                    </ng-template>\n                </upd-input>\n            </div>\n        </div>\n        <upd-list #list [items]=\"listItems\" [maxHeight]=\"dropdownMaxHeight + 'px'\" (selectedItem)=\"onSelectItem($event)\"\n            [wrapperClasses]=\"dropdownClasses\" [isVisible]=\"isDropdownOpen\" [shouldOverflow]=\"true\" [shouldDisplayItemsCounter]=\"true\">\n        </upd-list>\n    </div>\n} @else {\n    <select class=\"form-select\" [attr.placeholder]=\"placeholder\">\n        @for (item of localItems; track item) {\n            @if ((item.children?.length || 0) > 0) {\n                <optgroup [label]=\"item.text\">\n                    @for (child of item.children; track child) {\n                        <option [value]=\"child.value\">{{ child.text }}</option>\n                    }\n                </optgroup>\n            } @else {\n                <option [value]=\"item.value\">{{ item.text }}</option>\n            }\n        }\n    </select>\n}\n\n", styles: [".select-dropdown-content{position:absolute!important;background-color:var(--upd-card-bg);z-index:1;border:var(--upd-card-border-width) solid var(--upd-card-border-color)!important;border-radius:var(--upd-card-border-radius)!important;box-shadow:0 1px 1px #0000002e}.select-dropdown-content-open{display:block!important}.select-loader-wrapper{height:24px}.select-loader-wrapper .select-loader{height:24px;width:24px}.select-search-box{position:absolute;z-index:1;padding:.5rem;margin-top:-1px;background:var(--upd-body-bg);border:var(--upd-border-width) var(--upd-border-style) var(--upd-border-color)}.remove-bottom-radius{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.remove-top-radius{border-top-left-radius:0!important;border-top-right-radius:0!important}\n"], dependencies: [{ kind: "component", type: i1.ListComponent, selector: "upd-list", inputs: ["items", "shouldOverflow", "isFlush", "isVisible", "isHoverable", "shouldDisplayItemsCounter", "wrapperClasses", "maxHeight", "noRecordsFoundKey", "itemFoundKey", "itemsFoundKey"], outputs: ["checkboxChanged", "selectedItem"] }, { kind: "component", type: i2.InputComponent, selector: "upd-input", inputs: ["type", "placeholder", "label", "mask", "maskConfig", "hint", "hintTemplate", "hintAsTooltip", "value", "size", "customClasses", "wrapperClasses", "name", "maxLength", "isDisabled", "isPlainText", "isReadOnly", "isLoading", "isRound", "isFlush", "isInputGroupFlat", "isPrependButton", "isAppendButton", "isFloating", "isRequired", "loaderPosition", "prependIconModel", "appendIconModel", "validationStatus", "isValidationStatusLight", "invalidStatusText"], outputs: ["valueChange"] }, { kind: "directive", type: i2.InputPrependDirective, selector: "ng-template[updInputPrepend]" }, { kind: "component", type: i3.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "removeDefaultClasses", "customClasses", "tablerIcon", "heroIcon", "heroIconSize", "heroIconType"] }, { kind: "component", type: i4.ButtonComponent, selector: "upd-button", inputs: ["text", "model", "colorStyle", "brandColorStyle", "customClasses", "isActive", "isDisabled", "isOutline", "isGhost", "isSquare", "isPill", "isIcon", "isLoading", "isList", "isFloating", "isAction", "isNavigationLink", "shouldIgnoreBtnClass"], outputs: ["clicked"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SelectComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'upd-select', encapsulation: ViewEncapsulation.None, template: "@if (!!label) {\n    <label class=\"form-label\">{{ label }}</label>\n}\n\n@if (!useSystemStyle) {\n    <div class=\"dropdown\">\n        <div #componentBox class=\"input-group input-group-flat\">\n            <div class=\"form-control\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n                @if (!!currentSelection) {\n                    <span>{{ currentSelection.text }}</span>\n                }\n            </div>\n            <div class=\"input-group-text\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n                @if (!!currentSelection) {\n                    <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"clearSelection()\" customClasses=\"link-secondary\">\n                        <upd-icon [model]=\"{heroIcon:'x-mark', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                    </upd-button>\n                }\n                @if (!isLoading) {\n                    <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"openDropdown()\" customClasses=\"link-secondary ms-2\">\n                        <upd-icon [model]=\"{heroIcon:'chevron-down', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                    </upd-button>\n                } @else {\n                    <div class=\"select-loader-wrapper\">\n                        <div class=\"spinner-border spinner-border-sm text-muted select-loader\" role=\"status\"></div>\n                    </div>\n                }\n            </div>\n        </div>\n        <div #searchBox>\n            <div #searchBoxChild [style.visibility]=\"isDropdownOpen ? 'visible' : 'hidden'\" class=\"select-search-box\">\n                <upd-input [placeholder]=\"placeholder\" [isInputGroupFlat]=\"true\" (click)=\"openDropdown()\" (valueChange)=\"search($event)\">\n                    <ng-template updInputPrepend>\n                        <upd-icon [model]=\"{heroIcon:'magnifying-glass'}\"></upd-icon>\n                    </ng-template>\n                </upd-input>\n            </div>\n        </div>\n        <upd-list #list [items]=\"listItems\" [maxHeight]=\"dropdownMaxHeight + 'px'\" (selectedItem)=\"onSelectItem($event)\"\n            [wrapperClasses]=\"dropdownClasses\" [isVisible]=\"isDropdownOpen\" [shouldOverflow]=\"true\" [shouldDisplayItemsCounter]=\"true\">\n        </upd-list>\n    </div>\n} @else {\n    <select class=\"form-select\" [attr.placeholder]=\"placeholder\">\n        @for (item of localItems; track item) {\n            @if ((item.children?.length || 0) > 0) {\n                <optgroup [label]=\"item.text\">\n                    @for (child of item.children; track child) {\n                        <option [value]=\"child.value\">{{ child.text }}</option>\n                    }\n                </optgroup>\n            } @else {\n                <option [value]=\"item.value\">{{ item.text }}</option>\n            }\n        }\n    </select>\n}\n\n", styles: [".select-dropdown-content{position:absolute!important;background-color:var(--upd-card-bg);z-index:1;border:var(--upd-card-border-width) solid var(--upd-card-border-color)!important;border-radius:var(--upd-card-border-radius)!important;box-shadow:0 1px 1px #0000002e}.select-dropdown-content-open{display:block!important}.select-loader-wrapper{height:24px}.select-loader-wrapper .select-loader{height:24px;width:24px}.select-search-box{position:absolute;z-index:1;padding:.5rem;margin-top:-1px;background:var(--upd-body-bg);border:var(--upd-border-width) var(--upd-border-style) var(--upd-border-color)}.remove-bottom-radius{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.remove-top-radius{border-top-left-radius:0!important;border-top-right-radius:0!important}\n"] }]
+        }], propDecorators: { useSystemStyle: [{
+                type: Input
+            }], selectedItem: [{
+                type: Output
+            }] } });
+
+class SelectMultipleComponent extends BaseSelectComponent {
+    constructor() {
+        super(...arguments);
+        /**
+         * Triggered when an item is selected.
+         */
+        this.selectedItems = new EventEmitter();
+        this.currentSelection = [];
+    }
+    clearSelection() {
+        this.currentSelection = [];
+        this._currentTerm = undefined;
+        this.updateActiveItemsOnList();
+    }
+    onSelectItem(item) {
+        const selectedItem = this.currentSelection.find(cs => cs.value === item.id);
+        if (!!selectedItem) {
+            this.onRemoveItem(selectedItem);
+            return;
+        }
+        for (const localBackupItem of this._localBackupItems) {
+            if ((localBackupItem.children?.length || 0) > 0) {
+                const child = localBackupItem.children?.find(c => c.value === item.id);
+                if (!!child) {
+                    this.currentSelection.push(child);
+                    break;
+                }
+            }
+            else if (localBackupItem.value === item.id) {
+                this.currentSelection.push(localBackupItem);
+                break;
+            }
+        }
+        this.updateActiveItemsOnList();
+        this.selectedItems.emit(this.currentSelection);
+    }
+    onRemoveItem(item) {
+        const idx = this.currentSelection.findIndex(cs => cs.value === item.value);
+        this.currentSelection.splice(idx, 1);
+        this.updateActiveItemsOnList();
+    }
+    updateActiveItemsOnList() {
+        for (const backupItem of this._localBackupItems) {
+            const selectedItem = this.currentSelection.find(cs => cs.value === backupItem.value);
+            backupItem.listItem.isActive = !!selectedItem;
+        }
+        this._setupLocalItems(this._localBackupItems);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SelectMultipleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: SelectMultipleComponent, selector: "upd-select-multiple", outputs: { selectedItems: "selectedItems" }, usesInheritance: true, ngImport: i0, template: "@if (!!label) {\n    <label class=\"form-label\">{{ label }}</label>\n}\n\n<div class=\"dropdown\">\n    <div #componentBox class=\"input-group input-group-flat\">\n        <div class=\"form-control\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n            @for (sel of currentSelection; track sel) {\n                <span class=\"badge bg-primary select-multiple-value\">{{ sel.text }}\n                    <upd-button [isIcon]=\"true\" [shouldIgnoreBtnClass]=\"true\" (clicked)=\"onRemoveItem(sel)\">\n                        <upd-icon tablerIcon=\"x\"></upd-icon>\n                    </upd-button></span>&nbsp;\n            }\n        </div>\n        <div class=\"input-group-text\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n            @if (currentSelection.length > 0) {\n                <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"clearSelection()\" customClasses=\"link-secondary\">\n                    <upd-icon [model]=\"{heroIcon:'x-mark', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                </upd-button>\n            }\n            @if (!isLoading) {\n                <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"openDropdown()\" customClasses=\"link-secondary ms-2\">\n                    <upd-icon [model]=\"{heroIcon:'chevron-down', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                </upd-button>\n            } @else {\n                <div class=\"select-loader-wrapper\">\n                    <div class=\"spinner-border spinner-border-sm text-muted select-loader\" role=\"status\"></div>\n                </div>\n            }\n        </div>\n    </div>\n    <div #searchBox>\n        <div #searchBoxChild [style.visibility]=\"isDropdownOpen ? 'visible' : 'hidden'\" class=\"select-search-box\">\n            <upd-input [placeholder]=\"placeholder\" [isInputGroupFlat]=\"true\" (click)=\"openDropdown()\" (valueChange)=\"search($event)\">\n                <ng-template updInputPrepend>\n                    <upd-icon [model]=\"{heroIcon:'magnifying-glass'}\"></upd-icon>\n                </ng-template>\n            </upd-input>\n        </div>\n    </div>\n    <upd-list #list [items]=\"listItems\" [maxHeight]=\"dropdownMaxHeight + 'px'\" (selectedItem)=\"onSelectItem($event)\"\n        [wrapperClasses]=\"dropdownClasses\" [isVisible]=\"isDropdownOpen\" [shouldOverflow]=\"true\" [shouldDisplayItemsCounter]=\"true\">\n    </upd-list>\n</div>\n", styles: [".select-dropdown-content{position:absolute!important;background-color:var(--upd-card-bg);z-index:1;border:var(--upd-card-border-width) solid var(--upd-card-border-color)!important;border-radius:var(--upd-card-border-radius)!important;box-shadow:0 1px 1px #0000002e}.select-dropdown-content-open{display:block!important}.select-loader-wrapper{height:24px}.select-loader-wrapper .select-loader{height:24px;width:24px}.select-search-box{position:absolute;z-index:1;padding:.5rem;margin-top:-1px;background:var(--upd-body-bg);border:var(--upd-border-width) var(--upd-border-style) var(--upd-border-color)}.remove-bottom-radius{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.remove-top-radius{border-top-left-radius:0!important;border-top-right-radius:0!important}.select-multiple-value{display:inline-flex;align-items:center}\n"], dependencies: [{ kind: "component", type: i1.ListComponent, selector: "upd-list", inputs: ["items", "shouldOverflow", "isFlush", "isVisible", "isHoverable", "shouldDisplayItemsCounter", "wrapperClasses", "maxHeight", "noRecordsFoundKey", "itemFoundKey", "itemsFoundKey"], outputs: ["checkboxChanged", "selectedItem"] }, { kind: "component", type: i2.InputComponent, selector: "upd-input", inputs: ["type", "placeholder", "label", "mask", "maskConfig", "hint", "hintTemplate", "hintAsTooltip", "value", "size", "customClasses", "wrapperClasses", "name", "maxLength", "isDisabled", "isPlainText", "isReadOnly", "isLoading", "isRound", "isFlush", "isInputGroupFlat", "isPrependButton", "isAppendButton", "isFloating", "isRequired", "loaderPosition", "prependIconModel", "appendIconModel", "validationStatus", "isValidationStatusLight", "invalidStatusText"], outputs: ["valueChange"] }, { kind: "directive", type: i2.InputPrependDirective, selector: "ng-template[updInputPrepend]" }, { kind: "component", type: i3.IconComponent, selector: "upd-icon", inputs: ["model", "wrapperClasses", "color", "removeDefaultClasses", "customClasses", "tablerIcon", "heroIcon", "heroIconSize", "heroIconType"] }, { kind: "component", type: i4.ButtonComponent, selector: "upd-button", inputs: ["text", "model", "colorStyle", "brandColorStyle", "customClasses", "isActive", "isDisabled", "isOutline", "isGhost", "isSquare", "isPill", "isIcon", "isLoading", "isList", "isFloating", "isAction", "isNavigationLink", "shouldIgnoreBtnClass"], outputs: ["clicked"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: SelectMultipleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'upd-select-multiple', encapsulation: ViewEncapsulation.None, template: "@if (!!label) {\n    <label class=\"form-label\">{{ label }}</label>\n}\n\n<div class=\"dropdown\">\n    <div #componentBox class=\"input-group input-group-flat\">\n        <div class=\"form-control\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n            @for (sel of currentSelection; track sel) {\n                <span class=\"badge bg-primary select-multiple-value\">{{ sel.text }}\n                    <upd-button [isIcon]=\"true\" [shouldIgnoreBtnClass]=\"true\" (clicked)=\"onRemoveItem(sel)\">\n                        <upd-icon tablerIcon=\"x\"></upd-icon>\n                    </upd-button></span>&nbsp;\n            }\n        </div>\n        <div class=\"input-group-text\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n            @if (currentSelection.length > 0) {\n                <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"clearSelection()\" customClasses=\"link-secondary\">\n                    <upd-icon [model]=\"{heroIcon:'x-mark', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                </upd-button>\n            }\n            @if (!isLoading) {\n                <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"openDropdown()\" customClasses=\"link-secondary ms-2\">\n                    <upd-icon [model]=\"{heroIcon:'chevron-down', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                </upd-button>\n            } @else {\n                <div class=\"select-loader-wrapper\">\n                    <div class=\"spinner-border spinner-border-sm text-muted select-loader\" role=\"status\"></div>\n                </div>\n            }\n        </div>\n    </div>\n    <div #searchBox>\n        <div #searchBoxChild [style.visibility]=\"isDropdownOpen ? 'visible' : 'hidden'\" class=\"select-search-box\">\n            <upd-input [placeholder]=\"placeholder\" [isInputGroupFlat]=\"true\" (click)=\"openDropdown()\" (valueChange)=\"search($event)\">\n                <ng-template updInputPrepend>\n                    <upd-icon [model]=\"{heroIcon:'magnifying-glass'}\"></upd-icon>\n                </ng-template>\n            </upd-input>\n        </div>\n    </div>\n    <upd-list #list [items]=\"listItems\" [maxHeight]=\"dropdownMaxHeight + 'px'\" (selectedItem)=\"onSelectItem($event)\"\n        [wrapperClasses]=\"dropdownClasses\" [isVisible]=\"isDropdownOpen\" [shouldOverflow]=\"true\" [shouldDisplayItemsCounter]=\"true\">\n    </upd-list>\n</div>\n", styles: [".select-dropdown-content{position:absolute!important;background-color:var(--upd-card-bg);z-index:1;border:var(--upd-card-border-width) solid var(--upd-card-border-color)!important;border-radius:var(--upd-card-border-radius)!important;box-shadow:0 1px 1px #0000002e}.select-dropdown-content-open{display:block!important}.select-loader-wrapper{height:24px}.select-loader-wrapper .select-loader{height:24px;width:24px}.select-search-box{position:absolute;z-index:1;padding:.5rem;margin-top:-1px;background:var(--upd-body-bg);border:var(--upd-border-width) var(--upd-border-style) var(--upd-border-color)}.remove-bottom-radius{border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}.remove-top-radius{border-top-left-radius:0!important;border-top-right-radius:0!important}.select-multiple-value{display:inline-flex;align-items:center}\n"] }]
+        }], propDecorators: { selectedItems: [{
+                type: Output
+            }] } });
+
+class UpdSelectModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: UpdSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.1", ngImport: i0, type: UpdSelectModule, declarations: [SelectComponent,
+            SelectMultipleComponent], imports: [CommonModule,
+            UpdCoreLayoutModule,
+            UpdListModule,
+            UpdInputModule,
+            UpdIconsModule,
+            UpdButtonModule,
+            TranslocoModule], exports: [SelectComponent,
+            SelectMultipleComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: UpdSelectModule, imports: [CommonModule,
+            UpdCoreLayoutModule,
+            UpdListModule,
+            UpdInputModule,
+            UpdIconsModule,
+            UpdButtonModule,
+            TranslocoModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: UpdSelectModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule,
+                        UpdCoreLayoutModule,
+                        UpdListModule,
+                        UpdInputModule,
+                        UpdIconsModule,
+                        UpdButtonModule,
+                        TranslocoModule
+                    ],
+                    declarations: [
+                        SelectComponent,
+                        SelectMultipleComponent
+                    ],
+                    exports: [
+                        SelectComponent,
+                        SelectMultipleComponent
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SelectComponent, SelectMultipleComponent, UpdSelectModule };
+//# sourceMappingURL=updevs-components-form-controls-select.mjs.map

package/fesm2022/updevs-components-form-controls-select.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"updevs-components-form-controls-select.mjs","sources":["../../../../projects/updevs/components/form-controls/select/src/models/abstractions/base-select.component.ts","../../../../projects/updevs/components/form-controls/select/src/components/single/select.component.ts","../../../../projects/updevs/components/form-controls/select/src/components/single/select.component.html","../../../../projects/updevs/components/form-controls/select/src/components/multiple/select-multiple.component.ts","../../../../projects/updevs/components/form-controls/select/src/components/multiple/select-multiple.component.html","../../../../projects/updevs/components/form-controls/select/src/upd-select.module.ts","../../../../projects/updevs/components/form-controls/select/src/updevs-components-form-controls-select.ts"],"sourcesContent":["import {\n    Directive,\n    HostBinding,\n    ViewChild,\n    ElementRef,\n    OnInit,\n    Input,\n    Output,\n    EventEmitter,\n    inject,\n    NgZone,\n    Renderer2, RendererStyleFlags2\n} from '@angular/core';\nimport { BaseComponent, DomEventsService, PositioningService, ComputePositionResult } from '@updevs/sdk/layout';\nimport { ListItem } from '@updevs/components/list';\nimport { Tools } from '@updevs/sdk/core';\nimport { SearchRequestModel, SearchResponseModel, BaseSearchStore } from '@updevs/sdk/stores';\nimport { tap, debounceTime, Observable, Subject } from 'rxjs';\n\nimport { SelectItem } from '../select-item';\n\nimport Utils = Tools.Utils;\n\n@Directive()\nexport abstract class BaseSelectComponent extends BaseComponent implements OnInit {\n    @HostBinding('class') wrapperClasses = '';\n    @ViewChild('componentBox', { read: ElementRef }) componentBox?: ElementRef;\n    @ViewChild('searchBox', { read: ElementRef }) searchBox?: ElementRef;\n    @ViewChild('searchBoxChild', { read: ElementRef }) searchBoxChild?: ElementRef;\n    @ViewChild('list', { read: ElementRef }) list?: ElementRef;\n\n    /**\n     * Select items.\n     * If provided, the select will be considered static.\n     */\n    @Input() items?: SelectItem[];\n    /**\n     * Store used to load/filter the items.\n     */\n    @Input() store?: BaseSearchStore<any>;\n    /**\n     * Observable used to load/filter the items.\n     */\n    @Input() observable?: (request?: SearchRequestModel, masterId?: any) => Observable<SearchResponseModel<any>>;\n    /**\n     * Name of the property in the object that represents the ID/key of the option.\n     * **Note:** used only for remote data.\n     */\n    @Input() itemKey?: string;\n    /**\n     * Name of the property in the object that represents the value/description of the option.\n     * **Note:** used only for remote data.\n     */\n    @Input() itemValue?: string;\n    /**\n     * Description of the field.\n     */\n    @Input() label?: string;\n    /**\n     * Placeholder.\n     */\n    @Input() placeholder = '';\n    /**\n     * Maximum height of the dropdown.\n     */\n    @Input() dropdownMaxHeight = 300;\n    @Input() typeaheadDebounce = 200;\n    @Input() shouldAutoSearch = true;\n    @Input() shouldCloseOnOutsideClick = true;\n\n    @Output() readonly dropdownOpenStatusChange = new EventEmitter<boolean>();\n\n    isLoading = false;\n    localItems: SelectItem[] = [];\n    listItems: ListItem[] = [];\n    dropdownClasses = 'select-dropdown-content remove-top-radius';\n    get isDropdownOpen(): boolean {\n        return this._isDropdownOpen;\n    }\n    set isDropdownOpen(value: boolean) {\n        this._isDropdownOpen = value;\n\n        this.dropdownOpenStatusChange.emit(value);\n\n        if (value) {\n            this.dropdownClasses += ' select-dropdown-content-open';\n        } else {\n            this.dropdownClasses = this.dropdownClasses.replace(' select-dropdown-content-open', '');\n        }\n    }\n\n    protected _currentTerm?: string;\n    protected _localBackupItems: SelectItem[] = [];\n\n    private isStaticList = false;\n    private _isDropdownOpen = false;\n    private readonly searchInputSubject = new Subject<string>();\n    private readonly renderer = inject(Renderer2);\n    private readonly ngZone = inject(NgZone);\n    private readonly domEventsService = inject(DomEventsService);\n    private readonly positioningService = inject(PositioningService);\n\n    abstract clearSelection(): void;\n    abstract onSelectItem(item: ListItem): void;\n\n    ngOnInit(): void {\n        this.isStaticList = (this.items?.length || 0) > 0;\n\n        if (this.shouldAutoSearch) {\n            if (this.isStaticList) {\n                this._setupLocalItems(this.items!);\n            } else {\n                this.searchRemote();\n            }\n        }\n\n        if (this.isStaticList) {\n            return;\n        }\n\n        const typeaheadSubscription = this.searchInputSubject\n            .pipe(\n                tap(value => this._currentTerm = value),\n                debounceTime(this.typeaheadDebounce)\n            )\n            .subscribe(() => this.searchRemote());\n\n        this.addSubscriptions(typeaheadSubscription);\n    }\n\n    openDropdown(): void {\n        this.isDropdownOpen = true;\n\n        if (this.shouldCloseOnOutsideClick) {\n            const outsideClickSub = this.domEventsService.startOutsideClickListener(\n                () => this.ngZone.run(() => this.isDropdownOpen = false),\n                this.list?.nativeElement,\n                true,\n                this.componentBox?.nativeElement,\n                this.searchBox?.nativeElement\n            );\n            this.addSubscriptions(outsideClickSub);\n        }\n\n        this.ngZone.runOutsideAngular(() =>\n            this.positioningService\n                .computePosition(this.componentBox!, this.list!, { placement: 'bottom' })\n                .subscribe(resp => this.updatePosition(resp))\n        );\n    }\n\n    search(term?: string): void {\n        if (this.isStaticList) {\n            this.searchLocal();\n        } else {\n            this.searchInputSubject.next(term || '');\n        }\n    }\n\n    protected _setupLocalItems(items: SelectItem[]): void {\n        this.localItems = Utils.deepCopy(items);\n        this._localBackupItems = Utils.deepCopy(items);\n        const tempItems: ListItem[] = [];\n\n        for (const item of this._localBackupItems) {\n            let listItem = this.getListItem(item);\n            item.listItem = Object.assign(listItem, {});\n\n            tempItems.push(listItem);\n        }\n\n        this.listItems = [...tempItems];\n        this.isLoading = false;\n    }\n\n    private searchLocal(): void {\n        if (!this._currentTerm) {\n            this.listItems = Utils.deepCopy(this._localBackupItems.map(li => li.listItem!));\n            this.localItems = Utils.deepCopy(this._localBackupItems);\n\n            return;\n        }\n\n        this.ngZone.run(() => {\n            this.listItems = Utils.deepCopy<SelectItem[]>(this._localBackupItems).filter(si => {\n                let hasChildrenInSearch = false;\n\n                if ((si.children?.length || 0) > 0) {\n                    hasChildrenInSearch = si.children!.filter(\n                        ci => ci.text!.toLowerCase().includes(this._currentTerm!.toLowerCase())\n                    ).length > 0;\n                }\n\n                return si.text!.toLowerCase().includes(this._currentTerm!.toLowerCase()) || hasChildrenInSearch;\n            }).map(si => {\n                const bkpItem = this._localBackupItems.find(lbi => lbi.value === si.value);\n\n                if ((bkpItem?.children?.length || 0) > 0) {\n                    si.children = [...bkpItem!.children!].filter(\n                        ci => ci.text!.toLowerCase().includes(this._currentTerm!.toLowerCase())\n                    );\n                }\n\n                return this.getListItem(si);\n            });\n        });\n    }\n\n    private searchRemote(): void {\n        this.isLoading = true;\n        const request = new SearchRequestModel({ description: this._currentTerm });\n        const observable = !!this.observable ? this.observable(request) : this.store!.search(request);\n\n        observable.subscribe(r => {\n            const items: SelectItem[] = [];\n\n            r.records.forEach(item => {\n                items.push({\n                    value: item[this.itemKey!],\n                    text: item[this.itemValue!],\n                    objectData: item\n                });\n            });\n            this._setupLocalItems(items);\n        });\n    }\n\n    private getListItem(item: SelectItem): ListItem {\n        let listItem: ListItem;\n\n        if (!!item.listItem) {\n            listItem = item.listItem;\n            listItem.id = item.value;\n            listItem.text = item.text;\n        } else {\n            listItem = {\n                id: item.value,\n                text: item.text\n            };\n        }\n\n        if ((item.children?.length || 0) > 0) {\n            listItem.children = [...item.children!].map(c => this.getListItem(c));\n        }\n\n        return listItem;\n    }\n\n    private updatePosition(result: ComputePositionResult): void {\n        const componentBox = this.componentBox!.nativeElement.getBoundingClientRect();\n        const searchBoxChildElement = this.searchBoxChild?.nativeElement;\n        const ddElement = this.list!.nativeElement;\n\n        this.renderer.setStyle(searchBoxChildElement, 'width', `${Math.abs(componentBox.width)}px`, RendererStyleFlags2.Important);\n        this.renderer.setStyle(ddElement, 'top', `${result.y + searchBoxChildElement.scrollHeight}px`, RendererStyleFlags2.Important);\n        this.renderer.setStyle(ddElement, 'left', 0, RendererStyleFlags2.Important);\n        this.renderer.setStyle(ddElement, 'width', `${Math.abs(componentBox.width)}px`, RendererStyleFlags2.Important);\n    }\n}\n","import {\n    Component,\n    Input,\n    ViewEncapsulation,\n    Output,\n    EventEmitter\n} from '@angular/core';\nimport { ListItem } from '@updevs/components/list';\n\nimport { BaseSelectComponent } from '../../models/abstractions/base-select.component';\nimport { SelectItem } from '../../models/select-item';\n\n@Component({\n    selector: 'upd-select',\n    templateUrl: './select.component.html',\n    styleUrls: ['./select.component.scss'],\n    encapsulation: ViewEncapsulation.None\n})\nexport class SelectComponent extends BaseSelectComponent {\n    /**\n     * If true, it'll use the default style of the OS, no search capabilities.\n     */\n    @Input() useSystemStyle = false;\n\n    /**\n     * Triggered when an item is selected.\n     */\n    @Output() readonly selectedItem = new EventEmitter<SelectItem>();\n\n    currentSelection?: SelectItem;\n\n    onSelectItem(item: ListItem): void {\n        this._currentTerm = item.text;\n        this.isDropdownOpen = false;\n\n        for (const localBackupItem of this._localBackupItems) {\n            if ((localBackupItem.children?.length || 0) > 0) {\n                this.currentSelection = localBackupItem.children?.find(c => c.value === item.id);\n\n                if (!!this.currentSelection) {\n                    break;\n                }\n            } else if (localBackupItem.value === item.id) {\n                this.currentSelection = localBackupItem;\n                break;\n            }\n        }\n\n        this.selectedItem.emit(this.currentSelection);\n    }\n\n    clearSelection(): void {\n        this.currentSelection = undefined;\n        this._currentTerm = undefined;\n\n        this.search();\n    }\n}\n","@if (!!label) {\n    <label class=\"form-label\">{{ label }}</label>\n}\n\n@if (!useSystemStyle) {\n    <div class=\"dropdown\">\n        <div #componentBox class=\"input-group input-group-flat\">\n            <div class=\"form-control\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n                @if (!!currentSelection) {\n                    <span>{{ currentSelection.text }}</span>\n                }\n            </div>\n            <div class=\"input-group-text\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n                @if (!!currentSelection) {\n                    <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"clearSelection()\" customClasses=\"link-secondary\">\n                        <upd-icon [model]=\"{heroIcon:'x-mark', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                    </upd-button>\n                }\n                @if (!isLoading) {\n                    <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"openDropdown()\" customClasses=\"link-secondary ms-2\">\n                        <upd-icon [model]=\"{heroIcon:'chevron-down', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                    </upd-button>\n                } @else {\n                    <div class=\"select-loader-wrapper\">\n                        <div class=\"spinner-border spinner-border-sm text-muted select-loader\" role=\"status\"></div>\n                    </div>\n                }\n            </div>\n        </div>\n        <div #searchBox>\n            <div #searchBoxChild [style.visibility]=\"isDropdownOpen ? 'visible' : 'hidden'\" class=\"select-search-box\">\n                <upd-input [placeholder]=\"placeholder\" [isInputGroupFlat]=\"true\" (click)=\"openDropdown()\" (valueChange)=\"search($event)\">\n                    <ng-template updInputPrepend>\n                        <upd-icon [model]=\"{heroIcon:'magnifying-glass'}\"></upd-icon>\n                    </ng-template>\n                </upd-input>\n            </div>\n        </div>\n        <upd-list #list [items]=\"listItems\" [maxHeight]=\"dropdownMaxHeight + 'px'\" (selectedItem)=\"onSelectItem($event)\"\n            [wrapperClasses]=\"dropdownClasses\" [isVisible]=\"isDropdownOpen\" [shouldOverflow]=\"true\" [shouldDisplayItemsCounter]=\"true\">\n        </upd-list>\n    </div>\n} @else {\n    <select class=\"form-select\" [attr.placeholder]=\"placeholder\">\n        @for (item of localItems; track item) {\n            @if ((item.children?.length || 0) > 0) {\n                <optgroup [label]=\"item.text\">\n                    @for (child of item.children; track child) {\n                        <option [value]=\"child.value\">{{ child.text }}</option>\n                    }\n                </optgroup>\n            } @else {\n                <option [value]=\"item.value\">{{ item.text }}</option>\n            }\n        }\n    </select>\n}\n\n","import { Component, ViewEncapsulation, EventEmitter, Output } from '@angular/core';\nimport { ListItem } from '@updevs/components/list';\n\nimport { BaseSelectComponent } from '../../models/abstractions/base-select.component';\nimport { SelectItem } from '../../models/select-item';\n\n@Component({\n    selector: 'upd-select-multiple',\n    templateUrl: './select-multiple.component.html',\n    styleUrls: ['./select-multiple.component.scss'],\n    encapsulation: ViewEncapsulation.None\n})\nexport class SelectMultipleComponent extends BaseSelectComponent {\n    /**\n     * Triggered when an item is selected.\n     */\n    @Output() readonly selectedItems = new EventEmitter<SelectItem[]>();\n\n    currentSelection: SelectItem[] = [];\n\n    clearSelection(): void {\n        this.currentSelection = [];\n        this._currentTerm = undefined;\n\n        this.updateActiveItemsOnList();\n    }\n\n    onSelectItem(item: ListItem): void {\n        const selectedItem = this.currentSelection.find(cs => cs.value === item.id);\n\n        if (!!selectedItem) {\n            this.onRemoveItem(selectedItem);\n            return;\n        }\n\n        for (const localBackupItem of this._localBackupItems) {\n            if ((localBackupItem.children?.length || 0) > 0) {\n                const child = localBackupItem.children?.find(c => c.value === item.id);\n\n                if (!!child) {\n                    this.currentSelection.push(child);\n                    break;\n                }\n            } else if (localBackupItem.value === item.id) {\n                this.currentSelection.push(localBackupItem);\n                break;\n            }\n        }\n\n        this.updateActiveItemsOnList();\n        this.selectedItems.emit(this.currentSelection);\n    }\n\n    onRemoveItem(item: SelectItem): void {\n        const idx = this.currentSelection.findIndex(cs => cs.value === item.value);\n\n        this.currentSelection.splice(idx, 1);\n        this.updateActiveItemsOnList();\n    }\n\n    private updateActiveItemsOnList(): void {\n        for (const backupItem of this._localBackupItems) {\n            const selectedItem = this.currentSelection.find(cs => cs.value === backupItem.value);\n            backupItem.listItem!.isActive = !!selectedItem;\n        }\n\n        this._setupLocalItems(this._localBackupItems);\n    }\n}\n","@if (!!label) {\n    <label class=\"form-label\">{{ label }}</label>\n}\n\n<div class=\"dropdown\">\n    <div #componentBox class=\"input-group input-group-flat\">\n        <div class=\"form-control\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n            @for (sel of currentSelection; track sel) {\n                <span class=\"badge bg-primary select-multiple-value\">{{ sel.text }}\n                    <upd-button [isIcon]=\"true\" [shouldIgnoreBtnClass]=\"true\" (clicked)=\"onRemoveItem(sel)\">\n                        <upd-icon tablerIcon=\"x\"></upd-icon>\n                    </upd-button></span>&nbsp;\n            }\n        </div>\n        <div class=\"input-group-text\" [class.remove-bottom-radius]=\"isDropdownOpen\">\n            @if (currentSelection.length > 0) {\n                <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"clearSelection()\" customClasses=\"link-secondary\">\n                    <upd-icon [model]=\"{heroIcon:'x-mark', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                </upd-button>\n            }\n            @if (!isLoading) {\n                <upd-button [shouldIgnoreBtnClass]=\"true\" (clicked)=\"openDropdown()\" customClasses=\"link-secondary ms-2\">\n                    <upd-icon [model]=\"{heroIcon:'chevron-down', heroIconType: 'outline', heroIconSize:'small'}\"></upd-icon>\n                </upd-button>\n            } @else {\n                <div class=\"select-loader-wrapper\">\n                    <div class=\"spinner-border spinner-border-sm text-muted select-loader\" role=\"status\"></div>\n                </div>\n            }\n        </div>\n    </div>\n    <div #searchBox>\n        <div #searchBoxChild [style.visibility]=\"isDropdownOpen ? 'visible' : 'hidden'\" class=\"select-search-box\">\n            <upd-input [placeholder]=\"placeholder\" [isInputGroupFlat]=\"true\" (click)=\"openDropdown()\" (valueChange)=\"search($event)\">\n                <ng-template updInputPrepend>\n                    <upd-icon [model]=\"{heroIcon:'magnifying-glass'}\"></upd-icon>\n                </ng-template>\n            </upd-input>\n        </div>\n    </div>\n    <upd-list #list [items]=\"listItems\" [maxHeight]=\"dropdownMaxHeight + 'px'\" (selectedItem)=\"onSelectItem($event)\"\n        [wrapperClasses]=\"dropdownClasses\" [isVisible]=\"isDropdownOpen\" [shouldOverflow]=\"true\" [shouldDisplayItemsCounter]=\"true\">\n    </upd-list>\n</div>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { TranslocoModule } from '@ngneat/transloco';\nimport { UpdIconsModule } from '@updevs/icons';\nimport { UpdCoreLayoutModule } from '@updevs/sdk/layout';\nimport { UpdListModule } from '@updevs/components/list';\nimport { UpdButtonModule } from '@updevs/components/button';\nimport { UpdInputModule } from '@updevs/components/form-controls/input';\n\nimport { SelectComponent } from './components/single/select.component';\nimport { SelectMultipleComponent } from './components/multiple/select-multiple.component';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        UpdCoreLayoutModule,\n        UpdListModule,\n        UpdInputModule,\n        UpdIconsModule,\n        UpdButtonModule,\n        TranslocoModule\n    ],\n    declarations: [\n        SelectComponent,\n        SelectMultipleComponent\n    ],\n    exports: [\n        SelectComponent,\n        SelectMultipleComponent\n    ]\n})\nexport class UpdSelectModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/updevs-components-form-controls-textarea.mjs

@@ -0,0 +1,90 @@
+import * as i0 from '@angular/core';
+import { Component, ViewEncapsulation, HostBinding, Input, NgModule } from '@angular/core';
+import * as i1 from '@angular/common';
+import { CommonModule } from '@angular/common';
+
+class TextareaComponent {
+    constructor() {
+        this.hostWrapperClasses = '';
+        this.placeholder = '';
+        this.isDisabled = false;
+        this.isReadOnly = false;
+        this.displayCharactersCount = false;
+        this.classes = [];
+    }
+    ngOnInit() {
+        this.updateClasses();
+    }
+    ngOnChanges(changes) {
+        this.updateClasses();
+    }
+    updateValue(event) {
+        if (!event && !event.target) {
+            return;
+        }
+        const target = event.target;
+        this.value = target.value;
+    }
+    updateClasses() {
+        const lClasses = ['form-control'];
+        this.classes = [...lClasses, ...(this.customClasses || '').split(' ')];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: TextareaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.1", type: TextareaComponent, selector: "upd-textarea", inputs: { placeholder: "placeholder", label: "label", value: "value", customClasses: "customClasses", wrapperClasses: "wrapperClasses", name: "name", maxLength: "maxLength", rows: "rows", isDisabled: "isDisabled", isReadOnly: "isReadOnly", displayCharactersCount: "displayCharactersCount" }, host: { properties: { "class": "this.hostWrapperClasses" } }, usesOnChanges: true, ngImport: i0, template: "@if (!!label || displayCharactersCount) {\n    <label class=\"form-label\">\n        {{ label }}\n        @if (displayCharactersCount && !!maxLength) {\n            <span class=\"form-label-description\">{{ value?.length || 0 }}/{{ maxLength }}</span>\n        }\n    </label>\n}\n<textarea [attr.maxlength]=\"maxLength\" [disabled]=\"isDisabled\" [ngClass]=\"classes\"\n    [placeholder]=\"placeholder\" [value]=\"value || ''\" [attr.name]=\"name\" [attr.readonly]=\"isReadOnly ? '' : undefined\"\n    [attr.rows]=\"rows\" (input)=\"updateValue($event)\">\n</textarea>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: TextareaComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'upd-textarea', encapsulation: ViewEncapsulation.None, template: "@if (!!label || displayCharactersCount) {\n    <label class=\"form-label\">\n        {{ label }}\n        @if (displayCharactersCount && !!maxLength) {\n            <span class=\"form-label-description\">{{ value?.length || 0 }}/{{ maxLength }}</span>\n        }\n    </label>\n}\n<textarea [attr.maxlength]=\"maxLength\" [disabled]=\"isDisabled\" [ngClass]=\"classes\"\n    [placeholder]=\"placeholder\" [value]=\"value || ''\" [attr.name]=\"name\" [attr.readonly]=\"isReadOnly ? '' : undefined\"\n    [attr.rows]=\"rows\" (input)=\"updateValue($event)\">\n</textarea>\n" }]
+        }], propDecorators: { hostWrapperClasses: [{
+                type: HostBinding,
+                args: ['class']
+            }], placeholder: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], value: [{
+                type: Input
+            }], customClasses: [{
+                type: Input
+            }], wrapperClasses: [{
+                type: Input
+            }], name: [{
+                type: Input
+            }], maxLength: [{
+                type: Input
+            }], rows: [{
+                type: Input
+            }], isDisabled: [{
+                type: Input
+            }], isReadOnly: [{
+                type: Input
+            }], displayCharactersCount: [{
+                type: Input
+            }] } });
+
+class UpdTextareaModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: UpdTextareaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.0.1", ngImport: i0, type: UpdTextareaModule, declarations: [TextareaComponent], imports: [CommonModule], exports: [TextareaComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: UpdTextareaModule, imports: [CommonModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: UpdTextareaModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [
+                        CommonModule
+                    ],
+                    declarations: [
+                        TextareaComponent
+                    ],
+                    exports: [
+                        TextareaComponent
+                    ]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { TextareaComponent, UpdTextareaModule };
+//# sourceMappingURL=updevs-components-form-controls-textarea.mjs.map

package/fesm2022/updevs-components-form-controls-textarea.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"updevs-components-form-controls-textarea.mjs","sources":["../../../../projects/updevs/components/form-controls/textarea/src/textarea.component.ts","../../../../projects/updevs/components/form-controls/textarea/src/textarea.component.html","../../../../projects/updevs/components/form-controls/textarea/src/upd-textarea.module.ts","../../../../projects/updevs/components/form-controls/textarea/src/updevs-components-form-controls-textarea.ts"],"sourcesContent":["import { Component, ViewEncapsulation, Input, HostBinding, OnInit, OnChanges, SimpleChanges } from '@angular/core';\n\n@Component({\n    selector: 'upd-textarea',\n    templateUrl: './textarea.component.html',\n    styleUrls: ['./textarea.component.scss'],\n    encapsulation: ViewEncapsulation.None\n})\nexport class TextareaComponent implements OnInit, OnChanges {\n    @HostBinding('class') hostWrapperClasses = '';\n\n    @Input() placeholder = '';\n    @Input() label?: string;\n    @Input() value?: string;\n    @Input() customClasses?: string;\n    @Input() wrapperClasses?: string;\n    @Input() name?: string;\n    @Input() maxLength?: number;\n    @Input() rows?: number;\n    @Input() isDisabled = false;\n    @Input() isReadOnly = false;\n    @Input() displayCharactersCount = false;\n\n    classes: string[] = [];\n\n    ngOnInit(): void {\n        this.updateClasses();\n    }\n\n    ngOnChanges(changes: SimpleChanges): void {\n        this.updateClasses();\n    }\n\n    updateValue(event?: any): void {\n        if (!event && !event.target) {\n            return;\n        }\n\n        const target = event.target as HTMLTextAreaElement;\n        this.value = target.value;\n    }\n\n    private updateClasses(): void {\n        const lClasses: string[] = ['form-control'];\n        this.classes = [...lClasses, ...(this.customClasses || '').split(' ')];\n    }\n}\n","@if (!!label || displayCharactersCount) {\n    <label class=\"form-label\">\n        {{ label }}\n        @if (displayCharactersCount && !!maxLength) {\n            <span class=\"form-label-description\">{{ value?.length || 0 }}/{{ maxLength }}</span>\n        }\n    </label>\n}\n<textarea [attr.maxlength]=\"maxLength\" [disabled]=\"isDisabled\" [ngClass]=\"classes\"\n    [placeholder]=\"placeholder\" [value]=\"value || ''\" [attr.name]=\"name\" [attr.readonly]=\"isReadOnly ? '' : undefined\"\n    [attr.rows]=\"rows\" (input)=\"updateValue($event)\">\n</textarea>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { TextareaComponent } from './textarea.component';\n\n@NgModule({\n    imports: [\n        CommonModule\n    ],\n    declarations: [\n        TextareaComponent\n    ],\n    exports: [\n        TextareaComponent\n    ]\n})\nexport class UpdTextareaModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}