@coreui/angular-pro 4.2.33 → 4.2.36

package/lib/multi-select/multi-select/multi-select-search.directive.d.ts

@@ -0,0 +1,15 @@
+import { AfterViewInit, ElementRef, EventEmitter, OnDestroy } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class MultiSelectSearchDirective implements AfterViewInit, OnDestroy {
+    #private;
+    private readonly elementRef;
+    constructor(elementRef: ElementRef);
+    delay: number;
+    set value(value: string);
+    readonly valueChange: EventEmitter<string>;
+    ngAfterViewInit(): void;
+    ngOnDestroy(): void;
+    private setSubscription;
+    static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectSearchDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<MultiSelectSearchDirective, "[cMultiSelectSearch]", ["cMultiSelectSearch"], { "delay": "delay"; "value": "value"; }, { "valueChange": "valueChange"; }, never, never, false>;
+}

package/lib/multi-select/multi-select/multi-select.component.d.ts

@@ -1,17 +1,20 @@
-import { AfterContentInit, AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, IterableDiffers, NgZone, OnChanges, OnDestroy, OnInit, QueryList, Renderer2, SimpleChanges, ViewContainerRef } from '@angular/core';
-import { FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';
-import { BooleanInput } from '@angular/cdk/coercion';
+import { AfterViewInit, ChangeDetectorRef, ElementRef, EventEmitter, IterableDiffers, NgZone, OnChanges, OnDestroy, OnInit, QueryList, Renderer2, SimpleChanges, TemplateRef, ViewContainerRef } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
+import { FocusableOption, FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';
+import { BooleanInput } from '@angular/cdk/coercion';
+import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
+import { BehaviorSubject } from 'rxjs';
 import { Modifier, Options } from '@popperjs/core';
-import { IMultiSelect, IOption } from '../multi-select.type';
+import { IMultiSelect, IOption, SearchFn } from '../multi-select.type';
 import { MultiSelectService } from '../multi-select.service';
 import { MultiSelectOptionComponent } from '../multi-select-option/multi-select-option.component';
+import { TemplateIdDirective } from '../../shared';
 import * as i0 from "@angular/core";
 interface IPluralMap {
     [k: string]: string;
 }
 export declare const observeReferenceModifier: Modifier<string, any>;
-export declare class MultiSelectComponent implements IMultiSelect, ControlValueAccessor, AfterContentInit, AfterViewInit, OnChanges, OnDestroy, OnInit {
+export declare class MultiSelectComponent implements IMultiSelect, ControlValueAccessor, AfterViewInit, OnChanges, OnDestroy, OnInit {
     #private;
     private elementRef;
     private renderer;
@@ -26,35 +29,135 @@ export declare class MultiSelectComponent implements IMultiSelect, ControlValueA
     static ngAcceptInputType_multiple: BooleanInput;
     static ngAcceptInputType_disabled: BooleanInput;
     static ngAcceptInputType_virtualScroller: BooleanInput;
+    readonly optionsArray$: BehaviorSubject<IOption[]>;
+    readonly optionsSelected$: BehaviorSubject<IOption[]>;
+    readonly optionsSelected: Map<any, IOption>;
+    readonly value$: BehaviorSubject<string[]>;
     onChange: (value: any) => void;
     onTouched: () => void;
     writeValue(value: (string | string[])): void;
     registerOnChange(fn: any): void;
     registerOnTouched(fn: any): void;
     setDisabledState(isDisabled: boolean): void;
+    /**
+     * Enables selection cleaner element
+     * @type boolean
+     * @default true
+     */
     cleaner: boolean;
+    /**
+     * Disables multi-select component
+     * @type boolean
+     * @default false
+     */
     set disabled(value: boolean);
     get disabled(): boolean;
     private _disabled;
+    /**
+     * Specifies that multiple options can be selected at once
+     * @type boolean
+     * @default false
+     */
     set multiple(value: boolean);
     get multiple(): boolean;
     private _multiple;
-    nativeName: string;
+    /**
+     * Hidden native select form
+     * @type string
+     * @default ''
+     */
+    nativeFormId: string;
+    /**
+     * Hidden native select id
+     * @type string
+     * @default ''
+     */
     nativeId: string;
-    options: IOption[];
+    /**
+     * Hidden native select name
+     * @type string
+     * @default ''
+     */
+    nativeName: string;
+    /**
+     * List of option elements
+     * @type IOption[]
+     * @default []
+     */
+    set options(options: IOption[]);
+    get options(): IOption[];
+    /**
+     * Sets maxHeight of options list in px
+     * @type (string | number)
+     * @default 'auto'
+     */
     optionsMaxHeight: string;
-    optionsStyle: 'checkbox' | 'text';
+    /**
+     * Sets option style
+     * @type 'checkbox' | 'text'
+     * @default 'checkbox'
+     */
+    set optionsStyle(value: 'checkbox' | 'text');
+    /**
+     * Specifies a short hint that is visible in the search input
+     * @type string
+     * @default 'Select...'
+     */
     placeholder: string;
-    search: boolean | 'external';
+    /**
+     * Enables search input element
+     * @type boolean | SearchFn | 'external'
+     * @default true
+     */
+    search: (boolean | 'external' | SearchFn);
+    /**
+     * Sets the label for no results when filtering
+     * @type string
+     * @default 'no items'
+     */
     searchNoResultsLabel: string;
+    /**
+     * Sets initial search string
+     * @type string
+     * @default ''
+     */
     set searchValue(value: string);
     get searchValue(): string;
     private _searchValue;
+    /**
+     * Emits searchValue string for external filtering
+     * @type string
+     */
     readonly searchValueChange: EventEmitter<string>;
+    /**
+     * Enables select all button
+     * @type boolean
+     * @default true
+     */
     selectAll: boolean;
+    /**
+     * Sets the select all button label
+     * @type string
+     * @default 'Select all options'
+     */
     selectAllLabel: string;
+    /**
+     * Selection type
+     * @type 'counter' | 'tags' | 'text'
+     * @default 'tags'
+     */
     selectionType: 'counter' | 'tags' | 'text';
+    /**
+     * Counter selection label value
+     * @type string
+     * @default 'item(s) selected'
+     */
     selectionTypeCounterText: string;
+    /**
+     * Counter selection label plural map for I18nPluralPipe
+     * @type IPluralMap
+     * @default { '=1': 'item selected', 'other': 'items selected' }
+     */
     selectionTypeCounterTextPluralMap?: IPluralMap;
     /**
      * Size the component small or large.
@@ -67,7 +170,10 @@ export declare class MultiSelectComponent implements IMultiSelect, ControlValueA
      */
     set value(value: string | string[]);
     get value(): string | string[];
-    private _value;
+    /**
+     * Emits valueChange
+     * @type string | string[]
+     */
     readonly valueChange: EventEmitter<string | string[]>;
     /**
      * Toggle visual validation feedback.
@@ -76,10 +182,9 @@ export declare class MultiSelectComponent implements IMultiSelect, ControlValueA
      */
     valid?: boolean;
     /**
-     * Enable virtual scroller for the options list.
+     * Enable virtual scroller for options list.
      * @type boolean
      * @default false
-     * todo: virtual scroller implementation
      */
     set virtualScroller(value: boolean);
     get virtualScroller(): boolean;
@@ -87,11 +192,23 @@ export declare class MultiSelectComponent implements IMultiSelect, ControlValueA
     /**
      * Amount of visible options, if set - overwrites optionsMaxHeight
      * @type number
-     * @default 10
+     * @default 8
      */
     set visibleItems(value: number);
     get visibleItems(): number;
     private _visibleItems;
+    /**
+     * The size of the option item in the list (in pixels).
+     * @type number
+     * @default 40
+     */
+    itemSize: number;
+    /**
+     * Min width of the options list (in pixels).
+     * @type number
+     * @default 196
+     */
+    itemMinWidth: number;
     /**
      * Toggle the visibility of the dropdown select component.
      * @type boolean
@@ -100,6 +217,10 @@ export declare class MultiSelectComponent implements IMultiSelect, ControlValueA
     set visible(value: boolean);
     get visible(): boolean;
     private _visible;
+    /**
+     * Emits visibleChange
+     * @type boolean
+     */
     readonly visibleChange: EventEmitter<boolean>;
     /**
      * Optional popper Options object
@@ -107,21 +228,25 @@ export declare class MultiSelectComponent implements IMultiSelect, ControlValueA
      */
     popperjsOptions: Partial<Options>;
     isDropdownVisible: boolean;
-    set selectedOptions(value: any[]);
-    get selectedOptions(): any[];
-    private _selectedOptions;
+    get selectedOptions(): IOption[];
     get selectedOptionsText(): string;
     get counterText(): string;
     get counterTextType(): string;
-    private multiselectStateSubscription;
-    private multiselectVisibleSubscription;
     private focusMonitorSubscription;
-    multiSelectOptions: QueryList<MultiSelectOptionComponent>;
+    multiSelectOptionsContent: QueryList<MultiSelectOptionComponent>;
+    multiSelectOptionsView: QueryList<MultiSelectOptionComponent>;
+    scrollViewportView: QueryList<CdkVirtualScrollViewport>;
+    optionsElementRef: ElementRef;
+    protected scrollViewport: CdkVirtualScrollViewport;
+    protected templates: {
+        [id: string]: TemplateRef<any>;
+    };
+    contentTemplates: QueryList<TemplateIdDirective>;
     private listKeyManager;
     inputElement: ElementRef;
     dropdownMenu: ElementRef;
-    dropdownToggle: ElementRef;
     dropdown: ElementRef;
+    dropdownToggle: ElementRef;
     get hostClasses(): {
         disabled: boolean;
     };
@@ -144,30 +269,38 @@ export declare class MultiSelectComponent implements IMultiSelect, ControlValueA
     onClick($event: MouseEvent): void;
     visibleOptions: number;
     get subtreeFocused(): boolean;
-    set subtreeFocused(value: boolean);
+    set subtreeFocused(focused: boolean);
     private _subtreeFocused;
     private nativeSelectRef;
     focusOrigin(origin: FocusOrigin): boolean;
     ngOnInit(): void;
     ngOnDestroy(): void;
     ngOnChanges(changes: SimpleChanges): void;
-    ngAfterContentInit(): void;
+    makeOptions(options: IOption[]): void;
     ngAfterViewInit(): void;
+    private tabTarget;
     private multiselectSubscribe;
-    selectOptions(): void;
     clearAllOptions($event?: MouseEvent): void;
     selectAllOptions(): void;
-    handleTagRemove($event: IOption): void;
+    handleTagRemove(value: any): void;
     setFocus(origin?: FocusOrigin, methodName?: string): void;
     filterOptions(value: string): void;
     createNativeSelect(): void;
     updateNativeSelect(): void;
     inputElementSize(): void;
     handleSearchKeyDown($event: KeyboardEvent): void;
-    private selectOption;
-    private selectedOptionsUpdate;
     private setFocusMonitor;
+    activeOption: (FocusableOption & MultiSelectOptionComponent) | null;
+    handleScrolledIndexChange(scrolledIndex: number, scrollViewport: CdkVirtualScrollViewport): void;
+    trackByFn(index: number, option: IOption): string;
+    handleSearchValueChange(searchValue: string): void;
+    private setVirtualScroller;
+    private setListKeyManager;
+    get firstFocusableItem(): MultiSelectOptionComponent | undefined;
+    private setFirstItemActive;
+    updateActiveItem(index: number): void;
+    updateActiveItem<T extends (MultiSelectOptionComponent & FocusableOption)>(item: T): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectComponent, "c-multi-select", ["cMultiSelect"], { "cleaner": "cleaner"; "disabled": "disabled"; "multiple": "multiple"; "nativeName": "nativeName"; "nativeId": "nativeId"; "options": "options"; "optionsMaxHeight": "optionsMaxHeight"; "optionsStyle": "optionsStyle"; "placeholder": "placeholder"; "search": "search"; "searchNoResultsLabel": "searchNoResultsLabel"; "searchValue": "searchValue"; "selectAll": "selectAll"; "selectAllLabel": "selectAllLabel"; "selectionType": "selectionType"; "selectionTypeCounterText": "selectionTypeCounterText"; "selectionTypeCounterTextPluralMap": "selectionTypeCounterTextPluralMap"; "size": "size"; "value": "value"; "valid": "valid"; "virtualScroller": "virtualScroller"; "visibleItems": "visibleItems"; "visible": "visible"; "popperjsOptions": "popperOptions"; }, { "searchValueChange": "searchValueChange"; "valueChange": "valueChange"; "visibleChange": "visibleChange"; }, ["multiSelectOptions"], ["*"], false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectComponent, "c-multi-select", ["cMultiSelect"], { "cleaner": "cleaner"; "disabled": "disabled"; "multiple": "multiple"; "nativeFormId": "nativeFormId"; "nativeId": "nativeId"; "nativeName": "nativeName"; "options": "options"; "optionsMaxHeight": "optionsMaxHeight"; "optionsStyle": "optionsStyle"; "placeholder": "placeholder"; "search": "search"; "searchNoResultsLabel": "searchNoResultsLabel"; "searchValue": "searchValue"; "selectAll": "selectAll"; "selectAllLabel": "selectAllLabel"; "selectionType": "selectionType"; "selectionTypeCounterText": "selectionTypeCounterText"; "selectionTypeCounterTextPluralMap": "selectionTypeCounterTextPluralMap"; "size": "size"; "value": "value"; "valid": "valid"; "virtualScroller": "virtualScroller"; "visibleItems": "visibleItems"; "itemSize": "itemSize"; "itemMinWidth": "itemMinWidth"; "visible": "visible"; "popperjsOptions": "popperOptions"; }, { "searchValueChange": "searchValueChange"; "valueChange": "valueChange"; "visibleChange": "visibleChange"; }, ["multiSelectOptionsContent", "contentTemplates"], ["*"], false>;
 }
 export {};

package/lib/multi-select/multi-select-option/multi-select-option.component.d.ts

@@ -5,45 +5,87 @@ import { MultiSelectService } from '../multi-select.service';
 import * as i0 from "@angular/core";
 export declare class MultiSelectOptionComponent implements AfterViewInit, FocusableOption, OnDestroy {
     #private;
-    private readonly elementRef;
+    readonly elementRef: ElementRef;
     private readonly changeDetectorRef;
     private readonly focusMonitor;
     private readonly multiSelectService;
     constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef, focusMonitor: FocusMonitor, multiSelectService: MultiSelectService);
     static ngAcceptInputType_disabled: BooleanInput;
     static ngAcceptInputType_selected: BooleanInput;
+    /**
+     * Option style
+     * @type ('checkbox' | 'text')
+     * @default 'checkbox'
+     */
     optionsStyle: ('checkbox' | 'text');
+    /**
+     * Option label
+     * @type string
+     * @default undefined
+     */
     label?: string;
-    value?: string;
+    /**
+     * Option inner text
+     * @type string
+     * @default undefined
+     */
+    text?: string;
+    /**
+     * Option visible.
+     * @type boolean
+     * @default true
+     */
     visible: boolean;
-    selectedChange: EventEmitter<boolean>;
-    contentDiv?: ElementRef;
-    hasContent: boolean;
-    private dropdownVisible;
-    private _generatedId;
-    /** The id of the option element. */
-    get id(): string;
-    set id(value: string);
-    private _id;
+    /**
+     * Option disabled.
+     * @type boolean
+     * @default false
+     */
     set disabled(value: boolean);
     get disabled(): boolean;
-    private _disabled;
+    /**
+     * Option selected.
+     * @type boolean
+     * @default false
+     */
     set selected(value: (boolean | undefined));
     get selected(): (boolean | undefined);
-    private _selected;
+    /**
+     * Emits option selected change
+     * @type boolean
+     */
+    readonly selectedChange: EventEmitter<boolean>;
+    /**
+     * Option value.
+     * @type string
+     * @default undefined
+     */
+    set value(value: string);
+    get value(): string;
+    private contentDiv?;
+    hasContent: boolean;
+    set active(value: (boolean | undefined));
+    get active(): (boolean | undefined);
+    readonly focusChange: EventEmitter<MultiSelectOptionComponent>;
+    private get role();
     get hostClasses(): {
         [x: string]: boolean | undefined;
         'form-multi-select-option': boolean;
         'form-multi-selected': boolean | undefined;
         disabled: boolean;
         'd-none': boolean;
+        active: boolean | undefined;
+        focused: boolean;
     };
-    private get role();
     private get tabIndex();
+    private set tabIndex(value);
     private get ariaDisabled();
     private get ariaSelected();
+    private set ariaSelected(value);
     onKeyDown($event: KeyboardEvent): void;
-    onKeyUp($event: KeyboardEvent): void;
+    private onBlur;
+    private onFocus;
+    private onKeyUp;
     private onClick;
     ngAfterViewInit(): void;
     /** Get the label for this element which is required by the FocusableOption interface. */
@@ -52,5 +94,5 @@ export declare class MultiSelectOptionComponent implements AfterViewInit, Focusa
     ngOnDestroy(): void;
     private setSubscriptions;
     static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectOptionComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectOptionComponent, "c-multi-select-option", ["cMultiSelectOption"], { "optionsStyle": "optionsStyle"; "label": "label"; "value": "value"; "visible": "visible"; "id": "id"; "disabled": "disabled"; "selected": "selected"; "role": "role"; }, { "selectedChange": "selectedChange"; }, never, ["*"], false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectOptionComponent, "c-multi-select-option", ["cMultiSelectOption"], { "optionsStyle": "optionsStyle"; "label": "label"; "text": "text"; "visible": "visible"; "disabled": "disabled"; "selected": "selected"; "value": "value"; "active": "active"; "role": "role"; }, { "selectedChange": "selectedChange"; "focusChange": "focusChange"; }, never, ["*"], false>;
 }

package/lib/multi-select/multi-select-tag/multi-select-tag.component.d.ts

@@ -7,11 +7,14 @@ export declare class MultiSelectTagComponent {
     constructor(multiSelectService: MultiSelectService);
     multiselectVisible$: import("rxjs").Observable<boolean>;
     option?: IOption;
+    disabled: boolean;
+    label?: string;
+    value?: any;
     remove: EventEmitter<IOption>;
     get hostClasses(): {
         'form-multi-select-tag': boolean;
     };
-    handleRemove($event: any): void;
+    handleRemove($event: MouseEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectTagComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectTagComponent, "c-multi-select-tag", never, { "option": "option"; }, { "remove": "remove"; }, never, ["*"], false>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<MultiSelectTagComponent, "c-multi-select-tag", never, { "option": "option"; "disabled": "disabled"; "label": "label"; "value": "value"; }, { "remove": "remove"; }, never, never, false>;
 }

package/lib/multi-select/multi-select.module.d.ts

@@ -5,13 +5,15 @@ import * as i3 from "./multi-select-optgroup/multi-select-optgroup.component";
 import * as i4 from "./multi-select-optgroup/multi-select-optgroup-label.component";
 import * as i5 from "./multi-select-tag/multi-select-tag.component";
 import * as i6 from "./multi-select-native-select/multi-select-native-select.component";
-import * as i7 from "@angular/common";
-import * as i8 from "@angular/cdk/a11y";
-import * as i9 from "../button/button.module";
-import * as i10 from "@angular/forms";
-import * as i11 from "../dropdown/dropdown.module";
+import * as i7 from "./multi-select/multi-select-search.directive";
+import * as i8 from "@angular/common";
+import * as i9 from "@angular/cdk/a11y";
+import * as i10 from "../button/button.module";
+import * as i11 from "@angular/forms";
+import * as i12 from "../dropdown/dropdown.module";
+import * as i13 from "@angular/cdk/scrolling";
 export declare class MultiSelectModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<MultiSelectModule, [typeof i1.MultiSelectComponent, typeof i2.MultiSelectOptionComponent, typeof i3.MultiSelectOptgroupComponent, typeof i4.MultiSelectOptgroupLabelComponent, typeof i5.MultiSelectTagComponent, typeof i6.MultiSelectNativeSelectComponent], [typeof i7.CommonModule, typeof i8.A11yModule, typeof i9.ButtonModule, typeof i10.FormsModule, typeof i11.DropdownModule], [typeof i1.MultiSelectComponent, typeof i2.MultiSelectOptionComponent, typeof i3.MultiSelectOptgroupComponent, typeof i4.MultiSelectOptgroupLabelComponent, typeof i5.MultiSelectTagComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<MultiSelectModule, [typeof i1.MultiSelectComponent, typeof i2.MultiSelectOptionComponent, typeof i3.MultiSelectOptgroupComponent, typeof i4.MultiSelectOptgroupLabelComponent, typeof i5.MultiSelectTagComponent, typeof i6.MultiSelectNativeSelectComponent, typeof i7.MultiSelectSearchDirective], [typeof i8.CommonModule, typeof i9.A11yModule, typeof i10.ButtonModule, typeof i11.FormsModule, typeof i12.DropdownModule, typeof i13.ScrollingModule], [typeof i1.MultiSelectComponent, typeof i2.MultiSelectOptionComponent, typeof i3.MultiSelectOptgroupComponent, typeof i4.MultiSelectOptgroupLabelComponent, typeof i5.MultiSelectTagComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<MultiSelectModule>;
 }

package/lib/multi-select/multi-select.service.d.ts

@@ -1,12 +1,19 @@
+import { OnDestroy } from '@angular/core';
+import { SelectionModel } from '@angular/cdk/collections';
+import { MultiSelectOptionComponent } from './multi-select-option/multi-select-option.component';
 import * as i0 from "@angular/core";
-export declare class MultiSelectService {
-    constructor();
-    private multiSelectState;
-    multiSelectState$: import("rxjs").Observable<any>;
-    private multiSelectVisible;
-    multiSelectVisible$: import("rxjs").Observable<boolean>;
-    toggleOption(option: any): void;
+export declare class MultiSelectService implements OnDestroy {
+    #private;
+    ngOnDestroy(): void;
+    optionsStyle: 'checkbox' | 'text';
+    selectionModel: SelectionModel<any>;
+    setSelectionModel(multiple?: boolean, initiallySelectedValues?: string[]): void;
+    private readonly multiSelectVisible;
+    readonly multiSelectVisible$: import("rxjs").Observable<boolean>;
     toggleVisible(visible: boolean): void;
+    private readonly multiSelectFocus;
+    readonly multiSelectFocus$: import("rxjs").Observable<MultiSelectOptionComponent>;
+    focusChange(option: MultiSelectOptionComponent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MultiSelectService, never>;
     static ɵprov: i0.ɵɵInjectableDeclaration<MultiSelectService>;
 }

package/lib/multi-select/multi-select.type.d.ts

@@ -1,4 +1,5 @@
 import { EventEmitter } from '@angular/core';
+export declare type SearchFn = ((option: IOption, searchValue: string) => boolean);
 export interface IMultiSelect {
     cleaner?: boolean;
     multiple?: boolean;
@@ -6,7 +7,7 @@ export interface IMultiSelect {
     optionsMaxHeight?: (number | string | 'auto');
     optionsStyle?: (string | 'checkbox' | 'text');
     placeholder?: string;
-    search?: boolean | 'external';
+    search?: boolean | 'external' | SearchFn;
     searchValue?: string;
     searchValueChange?: EventEmitter<string>;
     searchNoResultsLabel?: string;
@@ -30,7 +31,8 @@ export interface IOption {
     order?: number;
     selected?: boolean;
     text?: string;
-    value?: number | string;
+    value: string;
+    visible?: boolean;
 }
 export interface IMultiSelectOptions {
     handleOptionClick?: (option: IOption) => void;

package/lib/multi-select/public_api.d.ts

@@ -4,3 +4,4 @@ export { MultiSelectOptionComponent } from './multi-select-option/multi-select-o
 export { MultiSelectTagComponent } from './multi-select-tag/multi-select-tag.component';
 export { MultiSelectComponent } from './multi-select/multi-select.component';
 export { MultiSelectModule } from './multi-select.module';
+export { IOption, SearchFn } from './multi-select.type';

package/lib/smart-table/smart-table/smart-table.component.d.ts

@@ -1,7 +1,7 @@
 import { AfterContentInit, EventEmitter, IterableDiffers, KeyValueDiffers, OnChanges, QueryList, SimpleChanges, TemplateRef } from '@angular/core';
 import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
 import { ITable } from '../../table/table.type';
-import { IColumnFilter, IColumnFilterValue, IItem, IItemInternal, ISmartTable, ISorter, ISorterValue, ITableFilter, ITableGroupProps, ItemsPerPageSelect } from '../smart-table.type';
+import { IColumn, IColumnFilter, IColumnFilterValue, IItem, IItemInternal, ISmartTable, ISorter, ISorterValue, ITableFilter, ITableGroupProps, ItemsPerPageSelect } from '../smart-table.type';
 import { TemplateIdDirective } from '../../shared';
 import * as i0 from "@angular/core";
 export declare class SmartTableComponent implements ISmartTable, AfterContentInit, OnChanges {
@@ -29,8 +29,8 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     set clickableRows(value: boolean);
     get clickableRows(): boolean;
     private _clickableRows;
-    set columns(value: any[]);
-    get columns(): any[];
+    set columns(value: (string | IColumn)[]);
+    get columns(): (string | IColumn)[];
     private _columns?;
     columnFilter?: boolean | IColumnFilter;
     set columnFilterValue(value: IColumnFilterValue);
@@ -102,8 +102,8 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
     get itemsOnActivePage(): IItemInternal[];
     get currentItems(): IItemInternal[];
     get genCols(): string[];
-    get rawColumnNames(): any[];
-    get itemsDataColumns(): any[];
+    get rawColumnNames(): string[];
+    get itemsDataColumns(): string[];
     get sortedItems(): IItemInternal[];
     get tableFilterEvent(): 'change' | 'input';
     private _columnFiltered;
@@ -132,7 +132,9 @@ export declare class SmartTableComponent implements ISmartTable, AfterContentIni
         align?: "top" | "bottom" | "middle" | undefined;
         color?: string | undefined;
     } | undefined;
-    tableDataCellClasses(item: IItem, colName: string): any;
+    tableDataCellClasses(item: IItem, colName: string): string | {
+        [klass: string]: any;
+    } | undefined;
     getColumnName($event: MouseEvent): string;
     handleRowClick(param: {
         $event: MouseEvent;

package/lib/smart-table/smart-table-head/smart-table-head.component.d.ts

@@ -30,8 +30,8 @@ export declare class SmartTableHeadComponent implements OnInit {
     getColumnSorterState(column: IColumn | string): string | number;
     prettifyName(name: string): string;
     handleSortClick(column: IColumn | string, i: number): void;
-    columnFilterEnabled(column: IColumn | string): boolean;
-    columnSorterEnabled(column: IColumn | string): boolean;
+    columnFilterEnabled(column: IColumn | string): boolean | ((column: import("../smart-table.type").IItem, value: string) => boolean);
+    columnSorterEnabled(column: IColumn | string): boolean | ((a: import("../smart-table.type").IItem, b: import("../smart-table.type").IItem) => number);
     handleColumnFilterValueChange($event: {
         value: string;
         type?: string;

package/lib/smart-table/smart-table.type.d.ts

@@ -125,7 +125,7 @@ export interface ISmartTable {
     pagination?: boolean;
     /**
      * Properties to `CSmartPagination` component.
-     * @link https://coreui.io/react/docs/4.0/components/smart-pagination#csmartpagination
+     * @link https://coreui.io/angular/docs/components/smart-pagination#csmartpagination
      * todo or remove?
      */
     /**
@@ -160,12 +160,12 @@ export interface ISmartTable {
     sortingIconDescending?: TemplateRef<any>;
     /**
      * Properties to `CTableBody` component.
-     * @link https://coreui.io/react/docs/4.0/components/table/#ctablebody
+     * @link https://coreui.io/angular/docs/components/table/#ctablebody
      * todo or remove?
      */
     /**
      * Properties to `CTableFoot` component.
-     * @link https://coreui.io/react/docs/4.0/components/table/#ctablefoot
+     * @link https://coreui.io/angular/docs/components/table/#ctablefoot
      * todo or remove?
      */
     /**
@@ -197,12 +197,12 @@ export interface ISmartTable {
     tableFilterValue?: string;
     /**
      * Properties to `CTableHead` component.
-     * @link https://coreui.io/react/docs/4.0/components/table/#ctablehead
+     * @link https://coreui.io/angular/docs/components/table/#ctablehead
      * todo or remove?
      */
     /**
      * Properties to `CTable` component.
-     * @link https://coreui.io/react/docs/4.0/components/table/#ctable
+     * @link https://coreui.io/angular/docs/components/table/#ctable
      */
     tableProps?: ITable;
 }
@@ -214,10 +214,10 @@ export interface IColumnFilterValue {
     [key: string]: any;
 }
 export interface IColumn {
-    filter?: boolean;
+    filter?: boolean | ((column: IItem, value: string) => boolean);
     label?: string;
     key: string;
-    sorter?: boolean;
+    sorter?: boolean | ((a: IItem, b: IItem) => number);
     _style?: any;
     _props?: ITableHeaderCellProps;
     _classes?: string | string[] | Set<string> | {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/angular-pro",
-  "version": "4.2.33",
+  "version": "4.2.36",
   "description": "CoreUI Pro Components Library for Angular",
   "homepage": "https://coreui.io/angular",
   "author": {