@annalib/anna-core 33.0.0 → 33.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/annalib-anna-core.mjs +2 -2
- package/fesm2022/annalib-anna-core.mjs.map +1 -1
- package/package.json +3 -3
- package/src/lib/anna-common-scss/_bootstrap-tooltip.scss +2 -0
- package/src/lib/anna-common-scss/_button.scss +1 -1
- package/src/lib/anna-common-scss/_customDropdown.scss +2 -1
- package/src/lib/anna-common-scss/_date-picker-form.scss +1 -1
- package/src/lib/anna-common-scss/_filters.scss +2 -1
- package/src/lib/anna-common-scss/_gt-table.scss +1 -1
- package/src/lib/anna-common-scss/_mat-button-toggle.scss +1 -1
- package/src/lib/anna-common-scss/_popup-filter-toggle-button.scss +1 -1
- package/src/lib/anna-common-scss/_sort.scss +1 -1
- package/src/lib/anna-common-scss/style.scss +7 -1
|
@@ -4420,7 +4420,7 @@ class AnnaSingleSelectComponent {
|
|
|
4420
4420
|
}
|
|
4421
4421
|
}
|
|
4422
4422
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AnnaSingleSelectComponent, deps: [{ token: AnnaGlobalConfigService }, { token: AnnaFilterSearchedTextPipe }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4423
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: AnnaSingleSelectComponent, isStandalone: true, selector: "anna-core-single-select", inputs: { config: "config", loading: "loading", showAdditionalDataInSelectedText: "showAdditionalDataInSelectedText", disabled: "disabled", items: "items", selectedItem: "selectedItem", keyToUseForDisplay: "keyToUseForDisplay", keyToUseForCheckingSelectedItem: "keyToUseForCheckingSelectedItem", hideDropdownArrow: "hideDropdownArrow", borderbottomObject: "borderbottomObject", defaultDropdownHeight: "defaultDropdownHeight", itemsToHideInDropdownIds: "itemsToHideInDropdownIds", showClearSelection: "showClearSelection" }, outputs: { valueChanged: "valueChanged", dropdownClosedEvent: "dropdownClosedEvent", dropdownOpenedEvent: "dropdownOpenedEvent", clearSelectionClickedEvent: "clearSelectionClickedEvent" }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["dropdown"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<button\r\n id=\"dropdown-trigger\"\r\n #dropdown\r\n #t=\"matMenuTrigger\"\r\n (menuClosed)=\"dropdownClosed()\"\r\n (menuOpened)=\"dropdownOpened()\"\r\n [matMenuTriggerFor]=\"contextMenu\"\r\n [disabled]=\"disabled || loading\"\r\n>\r\n <span\r\n class=\"placeholder\"\r\n *ngIf=\"!selectedItem && config\"\r\n >{{ config.placeholder }}</span\r\n >\r\n <span\r\n class=\"selected-item\"\r\n [class]=\"selectedItem.class\"\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"selectedItem\"\r\n >\r\n <ng-container *ngIf=\"(selectedItem | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n {{ selectedItem[keyToUseForDisplay] }}\r\n <ng-container *ngIf=\"showAdditionalDataInSelectedText && selectedItem && selectedItem?.additionalData\">\r\n <span [class]=\"selectedItem?.additionalClass\">{{ selectedItem?.additionalData }} </span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #stringTypeTemplate>\r\n {{ selectedItem }}\r\n </ng-template>\r\n </span>\r\n <div\r\n *ngIf=\"loading\"\r\n [ngClass]=\"{ 'spinner-for-button-directive': loading }\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"!loading && !hideDropdownArrow\">\r\n <i\r\n *ngIf=\"!t.menuOpen\"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"t.menuOpen\"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </ng-container>\r\n</button>\r\n<ng-content select=\".role-tooltip-icon\"></ng-content>\r\n<mat-menu\r\n backdropClass=\"single-select-dropdown\"\r\n [yPosition]=\"yPosition\"\r\n #contextMenu=\"matMenu\"\r\n>\r\n <ng-template matMenuContent>\r\n <div\r\n class=\"{{ config.classes }}\"\r\n [style.width.px]=\"width\"\r\n >\r\n <div\r\n class=\"gap\"\r\n *ngIf=\"config.showSearchBar\"\r\n ></div>\r\n <div\r\n *ngIf=\"showClearSelection\"\r\n class=\"clear-selection\"\r\n >\r\n <a\r\n (click)=\"clearSelectionClicked()\"\r\n [ngClass]=\"{ disabled: !selectedItem }\"\r\n >Clear selection</a\r\n >\r\n </div>\r\n <section\r\n *ngIf=\"config.showSearchBar\"\r\n class=\"search-bar\"\r\n >\r\n <i class=\"mi mdi-search search-icon\"></i>\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"searchFor\"\r\n placeholder=\"Search\"\r\n (ngModelChange)=\"updateHeight()\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n </section>\r\n <cdk-virtual-scroll-viewport\r\n class=\"dropdown-data-container\"\r\n itemSize=\"18\"\r\n [style.height.px]=\"heightOfCheckboxTooltipFilter\"\r\n >\r\n <ul\r\n class=\"single-select-ul\"\r\n [style.width.px]=\"width\"\r\n >\r\n <ng-container *ngIf=\"items && (items[0] | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *cdkVirtualFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n let last = last;\r\n trackBy: trackByFn\r\n \"\r\n [ngClass]=\"{\r\n active:\r\n selectedItem &&\r\n selectedItem[keyToUseForCheckingSelectedItem] ===\r\n item[keyToUseForCheckingSelectedItem],\r\n 'show-bottom-border': !last && borderbottomObject[item.id],\r\n disabled: item.isDisabled\r\n }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span [class]=\"item.class\"> {{ item[keyToUseForDisplay] }} </span>\r\n <ng-container *ngIf=\"item && item.additionalData\">\r\n <span\r\n class=\"ml-0\"\r\n [class]=\"item.additionalClass\"\r\n >\r\n {{ item?.additionalData }}\r\n </span>\r\n </ng-container>\r\n </li>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #stringTypeTemplate>\r\n <ng-container\r\n *ngFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n [ngClass]=\"{ active: selectedItem && selectedItem === item }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span> {{ item }} </span>\r\n </li>\r\n </ng-container>\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-template>\r\n </ul>\r\n </cdk-virtual-scroll-viewport>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template\r\n #noDataCase\r\n let-items=\"items\"\r\n>\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"(items | AnnafilterSearchedText: searchFor : keyToUseForDisplay)?.length === 0\"\r\n >\r\n <span> No data found </span>\r\n </li>\r\n</ng-template>\r\n", styles: ["#dropdown-trigger{height:1.5rem;background:#fff;border-radius:2px;border:1px solid #b7b7b7;width:100%;text-align:left;display:flex;align-items:center}#dropdown-trigger:disabled{background-color:#bdbdbd;opacity:.5}#dropdown-trigger:disabled .placeholder,#dropdown-trigger:disabled .icon{color:#000}.placeholder{color:#bdbdbd;width:100%;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;opacity:1!important}.icon{font-size:1.125rem;float:right;margin-left:auto}.search-bar{margin:0 7px 8px;border:1px solid #b7b7b7;height:24px;border-radius:2px}.search-bar input{outline:none;border:none;position:relative;bottom:4px;width:calc(100% - 29px);font-size:var(--dropdown-text-fs)}.search-bar .search-icon{font-size:var(--multi-select-dropdown-checkbox-fs);color:#9b9b9b;margin:5px}.search-bar .close-icon{cursor:pointer}ul{overflow-y:auto;padding-left:0;padding-bottom:0;margin-bottom:0;max-height:calc(50vh - 80px)!important}li{list-style-type:none;cursor:pointer;padding-inline:10px;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:2.14;letter-spacing:normal;color:#4a4a4a;width:100%}ul::-webkit-scrollbar{width:4px;height:4px}ul::-webkit-scrollbar-track{border:1px solid rgba(0,0,0,.1)}ul::-webkit-scrollbar-thumb{border-radius:4px;background-color:#0006!important;border:1px solid rgba(0,0,0,.2)}li:hover{background:#ebebeb}li.active{color:#fff;background:#268bff}span.selected-item{background:transparent;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;width:calc(100% - 22px);display:inline-block;vertical-align:middle}.ellipsify,li,span.selected-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::ng-deep .cdk-overlay-container{z-index:1051}span.red-color-text{color:#f44336!important}span.additional-data-color-text{color:#b7b6b6!important}span.italic{font-style:italic}.spinner-for-button-directive{left:0;margin-left:auto}.spinner-for-button-directive span.additional-data-color-text{color:#000}::ng-deep .mat-menu-panel{min-height:auto!important}.small-text li{font-size:12px!important}.ml-0{margin-left:0}#dropdown-trigger:disabled{cursor:default!important}#dropdown-trigger:disabled span{color:#4a4a4a!important;cursor:default!important}::ng-deep .mat-mdc-menu-panel.mat-elevation-z8{box-shadow:var(--dropdown-box-shadow)}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content{background-color:#fff;padding:0!important}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content.mdc-list{background-color:#fff}::ng-deep .mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:none!important}::ng-deep .mat-mdc-menu-panel .clear-selection{margin:0 7px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a{color:#268bff!important;text-decoration:underline!important;font-size:12px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a.disabled{color:#4a4a4a!important;pointer-events:none;cursor:not-allowed;opacity:.5}li{background-color:#fff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.5rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container li.disabled{opacity:.5;cursor:default}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.1875rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}::ng-deep ul.single-select-ul{max-height:none!important}li.show-bottom-border{border-bottom:1px solid #e6e6e6}::ng-deep .no-wrap-text ul li{line-height:1.41!important;padding-top:4px;padding-bottom:4px}::ng-deep .no-wrap-text ul li span{white-space:normal!important}.gap{height:9px}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i3.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: AnnaFilterSearchedTextPipe, name: "AnnafilterSearchedText" }, { kind: "pipe", type: AnnaTypeofDataPipe, name: "AnnatypeofData" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4423
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: AnnaSingleSelectComponent, isStandalone: true, selector: "anna-core-single-select", inputs: { config: "config", loading: "loading", showAdditionalDataInSelectedText: "showAdditionalDataInSelectedText", disabled: "disabled", items: "items", selectedItem: "selectedItem", keyToUseForDisplay: "keyToUseForDisplay", keyToUseForCheckingSelectedItem: "keyToUseForCheckingSelectedItem", hideDropdownArrow: "hideDropdownArrow", borderbottomObject: "borderbottomObject", defaultDropdownHeight: "defaultDropdownHeight", itemsToHideInDropdownIds: "itemsToHideInDropdownIds", showClearSelection: "showClearSelection" }, outputs: { valueChanged: "valueChanged", dropdownClosedEvent: "dropdownClosedEvent", dropdownOpenedEvent: "dropdownOpenedEvent", clearSelectionClickedEvent: "clearSelectionClickedEvent" }, viewQueries: [{ propertyName: "buttonElement", first: true, predicate: ["dropdown"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<button\r\n id=\"dropdown-trigger\"\r\n #dropdown\r\n #t=\"matMenuTrigger\"\r\n (menuClosed)=\"dropdownClosed()\"\r\n (menuOpened)=\"dropdownOpened()\"\r\n [matMenuTriggerFor]=\"contextMenu\"\r\n [disabled]=\"disabled || loading\"\r\n>\r\n <span\r\n class=\"placeholder\"\r\n *ngIf=\"!selectedItem && config\"\r\n >{{ config.placeholder }}</span\r\n >\r\n <span\r\n class=\"selected-item\"\r\n [class]=\"selectedItem.class\"\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"selectedItem\"\r\n >\r\n <ng-container *ngIf=\"(selectedItem | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n {{ selectedItem[keyToUseForDisplay] }}\r\n <ng-container *ngIf=\"showAdditionalDataInSelectedText && selectedItem && selectedItem?.additionalData\">\r\n <span [class]=\"selectedItem?.additionalClass\">{{ selectedItem?.additionalData }} </span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #stringTypeTemplate>\r\n {{ selectedItem }}\r\n </ng-template>\r\n </span>\r\n <div\r\n *ngIf=\"loading\"\r\n [ngClass]=\"{ 'spinner-for-button-directive': loading }\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"!loading && !hideDropdownArrow\">\r\n <i\r\n *ngIf=\"!t.menuOpen\"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"t.menuOpen\"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </ng-container>\r\n</button>\r\n<ng-content select=\".role-tooltip-icon\"></ng-content>\r\n<mat-menu\r\n backdropClass=\"single-select-dropdown\"\r\n [yPosition]=\"yPosition\"\r\n #contextMenu=\"matMenu\"\r\n>\r\n <ng-template matMenuContent>\r\n <div\r\n class=\"{{ config.classes }}\"\r\n [style.width.px]=\"width\"\r\n >\r\n <div\r\n class=\"gap\"\r\n *ngIf=\"config.showSearchBar\"\r\n ></div>\r\n <div\r\n *ngIf=\"showClearSelection\"\r\n class=\"clear-selection\"\r\n >\r\n <a\r\n (click)=\"clearSelectionClicked()\"\r\n [ngClass]=\"{ disabled: !selectedItem }\"\r\n >Clear selection</a\r\n >\r\n </div>\r\n <section\r\n *ngIf=\"config.showSearchBar\"\r\n class=\"search-bar\"\r\n >\r\n <i class=\"mi mdi-search search-icon\"></i>\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"searchFor\"\r\n placeholder=\"Search\"\r\n (ngModelChange)=\"updateHeight()\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n </section>\r\n <cdk-virtual-scroll-viewport\r\n class=\"dropdown-data-container\"\r\n itemSize=\"18\"\r\n [style.height.px]=\"heightOfCheckboxTooltipFilter\"\r\n >\r\n <ul\r\n class=\"single-select-ul\"\r\n [style.width.px]=\"width\"\r\n >\r\n <ng-container *ngIf=\"items && (items[0] | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *cdkVirtualFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n let last = last;\r\n trackBy: trackByFn\r\n \"\r\n [ngClass]=\"{\r\n active:\r\n selectedItem &&\r\n selectedItem[keyToUseForCheckingSelectedItem] ===\r\n item[keyToUseForCheckingSelectedItem],\r\n 'show-bottom-border': !last && borderbottomObject[item.id],\r\n disabled: item.isDisabled\r\n }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span [class]=\"item.class\"> {{ item[keyToUseForDisplay] }} </span>\r\n <ng-container *ngIf=\"item && item.additionalData\">\r\n <span\r\n class=\"ml-0\"\r\n [class]=\"item.additionalClass\"\r\n >\r\n {{ item?.additionalData }}\r\n </span>\r\n </ng-container>\r\n </li>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #stringTypeTemplate>\r\n <ng-container\r\n *ngFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n [ngClass]=\"{ active: selectedItem && selectedItem === item }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span> {{ item }} </span>\r\n </li>\r\n </ng-container>\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-template>\r\n </ul>\r\n </cdk-virtual-scroll-viewport>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template\r\n #noDataCase\r\n let-items=\"items\"\r\n>\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"(items | AnnafilterSearchedText: searchFor : keyToUseForDisplay)?.length === 0\"\r\n >\r\n <span> No data found </span>\r\n </li>\r\n</ng-template>\r\n", styles: ["#dropdown-trigger{height:1.5rem;background:#fff;border-radius:2px;border:1px solid #b7b7b7;width:100%;text-align:left;display:flex;align-items:center}#dropdown-trigger:disabled{background-color:#bdbdbd;opacity:.5}#dropdown-trigger:disabled .placeholder,#dropdown-trigger:disabled .icon{color:#000}.placeholder{color:#bdbdbd;width:100%;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;opacity:1!important}.icon{font-size:1.125rem;float:right;margin-left:auto}.search-bar{margin:0 7px 8px;border:1px solid #b7b7b7;height:24px;border-radius:2px}.search-bar input{outline:none;border:none;position:relative;bottom:4px;width:calc(100% - 29px);font-size:var(--dropdown-text-fs)}.search-bar .search-icon{font-size:var(--multi-select-dropdown-checkbox-fs);color:#9b9b9b;margin:5px}.search-bar .close-icon{cursor:pointer}ul{overflow-y:auto;padding-left:0;padding-bottom:0;margin-bottom:0;max-height:calc(50vh - 80px)!important}li{list-style-type:none;cursor:pointer;padding-inline:10px;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:2.14;letter-spacing:normal;color:#4a4a4a;width:100%}ul::-webkit-scrollbar{width:4px;height:4px}ul::-webkit-scrollbar-track{border:1px solid rgba(0,0,0,.1)}ul::-webkit-scrollbar-thumb{border-radius:4px;background-color:#0006!important;border:1px solid rgba(0,0,0,.2)}li:hover{background:#ebebeb}li.active{color:#fff;background:#268bff}span.selected-item{background:transparent;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;width:calc(100% - 22px);display:inline-block;vertical-align:middle}.ellipsify,li,span.selected-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::ng-deep .cdk-overlay-container{z-index:1051}span.red-color-text{color:#f44336!important}span.additional-data-color-text{color:#b7b6b6!important}span.italic{font-style:italic}.spinner-for-button-directive{left:0;margin-left:auto}.spinner-for-button-directive span.additional-data-color-text{color:#000}::ng-deep .mat-menu-panel{min-height:auto!important}.small-text li{font-size:12px!important}.ml-0{margin-left:0}#dropdown-trigger:disabled{cursor:default!important}#dropdown-trigger:disabled span{color:#4a4a4a!important;cursor:default!important}::ng-deep .mat-mdc-menu-panel.mat-elevation-z8{box-shadow:var(--dropdown-box-shadow)}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content{background-color:#fff;padding:0!important}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content.mdc-list{background-color:#fff}::ng-deep .mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:none!important}::ng-deep .mat-mdc-menu-panel .clear-selection{margin:0 7px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a{color:var(--primary-color)!important;text-decoration:underline!important;font-size:12px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a.disabled{color:#4a4a4a!important;pointer-events:none;cursor:not-allowed;opacity:.5}li{background-color:#fff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.5rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container li.disabled{opacity:.5;cursor:default}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.1875rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}::ng-deep ul.single-select-ul{max-height:none!important}li.show-bottom-border{border-bottom:1px solid #e6e6e6}::ng-deep .no-wrap-text ul li{line-height:1.41!important;padding-top:4px;padding-bottom:4px}::ng-deep .no-wrap-text ul li span{white-space:normal!important}.gap{height:9px}\n"], dependencies: [{ kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: i3.MatMenuContent, selector: "ng-template[matMenuContent]" }, { kind: "directive", type: i3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: AnnaFilterSearchedTextPipe, name: "AnnafilterSearchedText" }, { kind: "pipe", type: AnnaTypeofDataPipe, name: "AnnatypeofData" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4424
4424
|
}
|
|
4425
4425
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AnnaSingleSelectComponent, decorators: [{
|
|
4426
4426
|
type: Component,
|
|
@@ -4436,7 +4436,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
|
|
|
4436
4436
|
NgFor,
|
|
4437
4437
|
AnnaFilterSearchedTextPipe,
|
|
4438
4438
|
AnnaTypeofDataPipe,
|
|
4439
|
-
], template: "<button\r\n id=\"dropdown-trigger\"\r\n #dropdown\r\n #t=\"matMenuTrigger\"\r\n (menuClosed)=\"dropdownClosed()\"\r\n (menuOpened)=\"dropdownOpened()\"\r\n [matMenuTriggerFor]=\"contextMenu\"\r\n [disabled]=\"disabled || loading\"\r\n>\r\n <span\r\n class=\"placeholder\"\r\n *ngIf=\"!selectedItem && config\"\r\n >{{ config.placeholder }}</span\r\n >\r\n <span\r\n class=\"selected-item\"\r\n [class]=\"selectedItem.class\"\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"selectedItem\"\r\n >\r\n <ng-container *ngIf=\"(selectedItem | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n {{ selectedItem[keyToUseForDisplay] }}\r\n <ng-container *ngIf=\"showAdditionalDataInSelectedText && selectedItem && selectedItem?.additionalData\">\r\n <span [class]=\"selectedItem?.additionalClass\">{{ selectedItem?.additionalData }} </span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #stringTypeTemplate>\r\n {{ selectedItem }}\r\n </ng-template>\r\n </span>\r\n <div\r\n *ngIf=\"loading\"\r\n [ngClass]=\"{ 'spinner-for-button-directive': loading }\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"!loading && !hideDropdownArrow\">\r\n <i\r\n *ngIf=\"!t.menuOpen\"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"t.menuOpen\"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </ng-container>\r\n</button>\r\n<ng-content select=\".role-tooltip-icon\"></ng-content>\r\n<mat-menu\r\n backdropClass=\"single-select-dropdown\"\r\n [yPosition]=\"yPosition\"\r\n #contextMenu=\"matMenu\"\r\n>\r\n <ng-template matMenuContent>\r\n <div\r\n class=\"{{ config.classes }}\"\r\n [style.width.px]=\"width\"\r\n >\r\n <div\r\n class=\"gap\"\r\n *ngIf=\"config.showSearchBar\"\r\n ></div>\r\n <div\r\n *ngIf=\"showClearSelection\"\r\n class=\"clear-selection\"\r\n >\r\n <a\r\n (click)=\"clearSelectionClicked()\"\r\n [ngClass]=\"{ disabled: !selectedItem }\"\r\n >Clear selection</a\r\n >\r\n </div>\r\n <section\r\n *ngIf=\"config.showSearchBar\"\r\n class=\"search-bar\"\r\n >\r\n <i class=\"mi mdi-search search-icon\"></i>\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"searchFor\"\r\n placeholder=\"Search\"\r\n (ngModelChange)=\"updateHeight()\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n </section>\r\n <cdk-virtual-scroll-viewport\r\n class=\"dropdown-data-container\"\r\n itemSize=\"18\"\r\n [style.height.px]=\"heightOfCheckboxTooltipFilter\"\r\n >\r\n <ul\r\n class=\"single-select-ul\"\r\n [style.width.px]=\"width\"\r\n >\r\n <ng-container *ngIf=\"items && (items[0] | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *cdkVirtualFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n let last = last;\r\n trackBy: trackByFn\r\n \"\r\n [ngClass]=\"{\r\n active:\r\n selectedItem &&\r\n selectedItem[keyToUseForCheckingSelectedItem] ===\r\n item[keyToUseForCheckingSelectedItem],\r\n 'show-bottom-border': !last && borderbottomObject[item.id],\r\n disabled: item.isDisabled\r\n }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span [class]=\"item.class\"> {{ item[keyToUseForDisplay] }} </span>\r\n <ng-container *ngIf=\"item && item.additionalData\">\r\n <span\r\n class=\"ml-0\"\r\n [class]=\"item.additionalClass\"\r\n >\r\n {{ item?.additionalData }}\r\n </span>\r\n </ng-container>\r\n </li>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #stringTypeTemplate>\r\n <ng-container\r\n *ngFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n [ngClass]=\"{ active: selectedItem && selectedItem === item }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span> {{ item }} </span>\r\n </li>\r\n </ng-container>\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-template>\r\n </ul>\r\n </cdk-virtual-scroll-viewport>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template\r\n #noDataCase\r\n let-items=\"items\"\r\n>\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"(items | AnnafilterSearchedText: searchFor : keyToUseForDisplay)?.length === 0\"\r\n >\r\n <span> No data found </span>\r\n </li>\r\n</ng-template>\r\n", styles: ["#dropdown-trigger{height:1.5rem;background:#fff;border-radius:2px;border:1px solid #b7b7b7;width:100%;text-align:left;display:flex;align-items:center}#dropdown-trigger:disabled{background-color:#bdbdbd;opacity:.5}#dropdown-trigger:disabled .placeholder,#dropdown-trigger:disabled .icon{color:#000}.placeholder{color:#bdbdbd;width:100%;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;opacity:1!important}.icon{font-size:1.125rem;float:right;margin-left:auto}.search-bar{margin:0 7px 8px;border:1px solid #b7b7b7;height:24px;border-radius:2px}.search-bar input{outline:none;border:none;position:relative;bottom:4px;width:calc(100% - 29px);font-size:var(--dropdown-text-fs)}.search-bar .search-icon{font-size:var(--multi-select-dropdown-checkbox-fs);color:#9b9b9b;margin:5px}.search-bar .close-icon{cursor:pointer}ul{overflow-y:auto;padding-left:0;padding-bottom:0;margin-bottom:0;max-height:calc(50vh - 80px)!important}li{list-style-type:none;cursor:pointer;padding-inline:10px;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:2.14;letter-spacing:normal;color:#4a4a4a;width:100%}ul::-webkit-scrollbar{width:4px;height:4px}ul::-webkit-scrollbar-track{border:1px solid rgba(0,0,0,.1)}ul::-webkit-scrollbar-thumb{border-radius:4px;background-color:#0006!important;border:1px solid rgba(0,0,0,.2)}li:hover{background:#ebebeb}li.active{color:#fff;background:#268bff}span.selected-item{background:transparent;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;width:calc(100% - 22px);display:inline-block;vertical-align:middle}.ellipsify,li,span.selected-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::ng-deep .cdk-overlay-container{z-index:1051}span.red-color-text{color:#f44336!important}span.additional-data-color-text{color:#b7b6b6!important}span.italic{font-style:italic}.spinner-for-button-directive{left:0;margin-left:auto}.spinner-for-button-directive span.additional-data-color-text{color:#000}::ng-deep .mat-menu-panel{min-height:auto!important}.small-text li{font-size:12px!important}.ml-0{margin-left:0}#dropdown-trigger:disabled{cursor:default!important}#dropdown-trigger:disabled span{color:#4a4a4a!important;cursor:default!important}::ng-deep .mat-mdc-menu-panel.mat-elevation-z8{box-shadow:var(--dropdown-box-shadow)}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content{background-color:#fff;padding:0!important}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content.mdc-list{background-color:#fff}::ng-deep .mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:none!important}::ng-deep .mat-mdc-menu-panel .clear-selection{margin:0 7px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a{color:#268bff!important;text-decoration:underline!important;font-size:12px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a.disabled{color:#4a4a4a!important;pointer-events:none;cursor:not-allowed;opacity:.5}li{background-color:#fff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.5rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container li.disabled{opacity:.5;cursor:default}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.1875rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}::ng-deep ul.single-select-ul{max-height:none!important}li.show-bottom-border{border-bottom:1px solid #e6e6e6}::ng-deep .no-wrap-text ul li{line-height:1.41!important;padding-top:4px;padding-bottom:4px}::ng-deep .no-wrap-text ul li span{white-space:normal!important}.gap{height:9px}\n"] }]
|
|
4439
|
+
], template: "<button\r\n id=\"dropdown-trigger\"\r\n #dropdown\r\n #t=\"matMenuTrigger\"\r\n (menuClosed)=\"dropdownClosed()\"\r\n (menuOpened)=\"dropdownOpened()\"\r\n [matMenuTriggerFor]=\"contextMenu\"\r\n [disabled]=\"disabled || loading\"\r\n>\r\n <span\r\n class=\"placeholder\"\r\n *ngIf=\"!selectedItem && config\"\r\n >{{ config.placeholder }}</span\r\n >\r\n <span\r\n class=\"selected-item\"\r\n [class]=\"selectedItem.class\"\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"selectedItem\"\r\n >\r\n <ng-container *ngIf=\"(selectedItem | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n {{ selectedItem[keyToUseForDisplay] }}\r\n <ng-container *ngIf=\"showAdditionalDataInSelectedText && selectedItem && selectedItem?.additionalData\">\r\n <span [class]=\"selectedItem?.additionalClass\">{{ selectedItem?.additionalData }} </span>\r\n </ng-container>\r\n </ng-container>\r\n <ng-template #stringTypeTemplate>\r\n {{ selectedItem }}\r\n </ng-template>\r\n </span>\r\n <div\r\n *ngIf=\"loading\"\r\n [ngClass]=\"{ 'spinner-for-button-directive': loading }\"\r\n ></div>\r\n\r\n <ng-container *ngIf=\"!loading && !hideDropdownArrow\">\r\n <i\r\n *ngIf=\"!t.menuOpen\"\r\n class=\"mdi mdi-menu-down icon\"\r\n ></i>\r\n <i\r\n *ngIf=\"t.menuOpen\"\r\n class=\"mdi mdi-menu-up icon\"\r\n ></i>\r\n </ng-container>\r\n</button>\r\n<ng-content select=\".role-tooltip-icon\"></ng-content>\r\n<mat-menu\r\n backdropClass=\"single-select-dropdown\"\r\n [yPosition]=\"yPosition\"\r\n #contextMenu=\"matMenu\"\r\n>\r\n <ng-template matMenuContent>\r\n <div\r\n class=\"{{ config.classes }}\"\r\n [style.width.px]=\"width\"\r\n >\r\n <div\r\n class=\"gap\"\r\n *ngIf=\"config.showSearchBar\"\r\n ></div>\r\n <div\r\n *ngIf=\"showClearSelection\"\r\n class=\"clear-selection\"\r\n >\r\n <a\r\n (click)=\"clearSelectionClicked()\"\r\n [ngClass]=\"{ disabled: !selectedItem }\"\r\n >Clear selection</a\r\n >\r\n </div>\r\n <section\r\n *ngIf=\"config.showSearchBar\"\r\n class=\"search-bar\"\r\n >\r\n <i class=\"mi mdi-search search-icon\"></i>\r\n <input\r\n type=\"text\"\r\n [(ngModel)]=\"searchFor\"\r\n placeholder=\"Search\"\r\n (ngModelChange)=\"updateHeight()\"\r\n (click)=\"$event.stopPropagation()\"\r\n />\r\n </section>\r\n <cdk-virtual-scroll-viewport\r\n class=\"dropdown-data-container\"\r\n itemSize=\"18\"\r\n [style.height.px]=\"heightOfCheckboxTooltipFilter\"\r\n >\r\n <ul\r\n class=\"single-select-ul\"\r\n [style.width.px]=\"width\"\r\n >\r\n <ng-container *ngIf=\"items && (items[0] | AnnatypeofData) === 'object'; else stringTypeTemplate\">\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *cdkVirtualFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n let last = last;\r\n trackBy: trackByFn\r\n \"\r\n [ngClass]=\"{\r\n active:\r\n selectedItem &&\r\n selectedItem[keyToUseForCheckingSelectedItem] ===\r\n item[keyToUseForCheckingSelectedItem],\r\n 'show-bottom-border': !last && borderbottomObject[item.id],\r\n disabled: item.isDisabled\r\n }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span [class]=\"item.class\"> {{ item[keyToUseForDisplay] }} </span>\r\n <ng-container *ngIf=\"item && item.additionalData\">\r\n <span\r\n class=\"ml-0\"\r\n [class]=\"item.additionalClass\"\r\n >\r\n {{ item?.additionalData }}\r\n </span>\r\n </ng-container>\r\n </li>\r\n\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-container>\r\n\r\n <ng-template #stringTypeTemplate>\r\n <ng-container\r\n *ngFor=\"\r\n let item of items | AnnafilterSearchedText: searchFor : keyToUseForDisplay;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n [ngClass]=\"{ active: selectedItem && selectedItem === item }\"\r\n (click)=\"itemSelected(item, $event)\"\r\n >\r\n <span> {{ item }} </span>\r\n </li>\r\n </ng-container>\r\n <ng-container\r\n [ngTemplateOutlet]=\"noDataCase\"\r\n [ngTemplateOutletContext]=\"{ items: items }\"\r\n ></ng-container>\r\n </ng-template>\r\n </ul>\r\n </cdk-virtual-scroll-viewport>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template\r\n #noDataCase\r\n let-items=\"items\"\r\n>\r\n <li\r\n annaCoreShowEllipsisTextOnHover\r\n *ngIf=\"(items | AnnafilterSearchedText: searchFor : keyToUseForDisplay)?.length === 0\"\r\n >\r\n <span> No data found </span>\r\n </li>\r\n</ng-template>\r\n", styles: ["#dropdown-trigger{height:1.5rem;background:#fff;border-radius:2px;border:1px solid #b7b7b7;width:100%;text-align:left;display:flex;align-items:center}#dropdown-trigger:disabled{background-color:#bdbdbd;opacity:.5}#dropdown-trigger:disabled .placeholder,#dropdown-trigger:disabled .icon{color:#000}.placeholder{color:#bdbdbd;width:100%;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;opacity:1!important}.icon{font-size:1.125rem;float:right;margin-left:auto}.search-bar{margin:0 7px 8px;border:1px solid #b7b7b7;height:24px;border-radius:2px}.search-bar input{outline:none;border:none;position:relative;bottom:4px;width:calc(100% - 29px);font-size:var(--dropdown-text-fs)}.search-bar .search-icon{font-size:var(--multi-select-dropdown-checkbox-fs);color:#9b9b9b;margin:5px}.search-bar .close-icon{cursor:pointer}ul{overflow-y:auto;padding-left:0;padding-bottom:0;margin-bottom:0;max-height:calc(50vh - 80px)!important}li{list-style-type:none;cursor:pointer;padding-inline:10px;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:2.14;letter-spacing:normal;color:#4a4a4a;width:100%}ul::-webkit-scrollbar{width:4px;height:4px}ul::-webkit-scrollbar-track{border:1px solid rgba(0,0,0,.1)}ul::-webkit-scrollbar-thumb{border-radius:4px;background-color:#0006!important;border:1px solid rgba(0,0,0,.2)}li:hover{background:#ebebeb}li.active{color:#fff;background:#268bff}span.selected-item{background:transparent;font-family:Roboto;font-size:var(--dropdown-text-fs);font-weight:400;font-stretch:normal;font-style:normal;line-height:normal;letter-spacing:normal;color:#4a4a4a;width:calc(100% - 22px);display:inline-block;vertical-align:middle}.ellipsify,li,span.selected-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}::ng-deep .cdk-overlay-container{z-index:1051}span.red-color-text{color:#f44336!important}span.additional-data-color-text{color:#b7b6b6!important}span.italic{font-style:italic}.spinner-for-button-directive{left:0;margin-left:auto}.spinner-for-button-directive span.additional-data-color-text{color:#000}::ng-deep .mat-menu-panel{min-height:auto!important}.small-text li{font-size:12px!important}.ml-0{margin-left:0}#dropdown-trigger:disabled{cursor:default!important}#dropdown-trigger:disabled span{color:#4a4a4a!important;cursor:default!important}::ng-deep .mat-mdc-menu-panel.mat-elevation-z8{box-shadow:var(--dropdown-box-shadow)}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content{background-color:#fff;padding:0!important}::ng-deep .mat-mdc-menu-panel .mat-mdc-menu-content.mdc-list{background-color:#fff}::ng-deep .mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:none!important}::ng-deep .mat-mdc-menu-panel .clear-selection{margin:0 7px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a{color:var(--primary-color)!important;text-decoration:underline!important;font-size:12px!important}::ng-deep .mat-mdc-menu-panel .clear-selection a.disabled{color:#4a4a4a!important;pointer-events:none;cursor:not-allowed;opacity:.5}li{background-color:#fff}cdk-virtual-scroll-viewport.dropdown-data-container{max-height:12.5rem;width:100%;overflow-y:auto;overflow-x:hidden}cdk-virtual-scroll-viewport.dropdown-data-container li.disabled{opacity:.5;cursor:default}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar{width:.1875rem}cdk-virtual-scroll-viewport.dropdown-data-container::-webkit-scrollbar-thumb{color:#d3d3d3;background:#d3d3d3}::ng-deep ul.single-select-ul{max-height:none!important}li.show-bottom-border{border-bottom:1px solid #e6e6e6}::ng-deep .no-wrap-text ul li{line-height:1.41!important;padding-top:4px;padding-bottom:4px}::ng-deep .no-wrap-text ul li span{white-space:normal!important}.gap{height:9px}\n"] }]
|
|
4440
4440
|
}], ctorParameters: () => [{ type: AnnaGlobalConfigService }, { type: AnnaFilterSearchedTextPipe }], propDecorators: { config: [{
|
|
4441
4441
|
type: Input
|
|
4442
4442
|
}], loading: [{
|