@coreui/angular-pro 5.5.8 → 5.5.9

package/index.d.ts

@@ -1,15 +1,16 @@
 import { IsActiveMatchOptions, UrlTree, Router, NavigationEnd } from '@angular/router';
 import * as _angular_core from '@angular/core';
-import { ElementRef, TemplateRef, ModuleWithProviders, OnInit, OnDestroy, InputSignal, InputSignalWithTransform, QueryList, AfterViewInit, PipeTransform, AfterContentInit, AfterContentChecked, ModelSignal, ChangeDetectorRef, ViewContainerRef, OutputEmitterRef, OnChanges, SimpleChanges, EventEmitter, Renderer2, WritableSignal, ComponentRef, Injector, NgModuleRef } from '@angular/core';
+import { ElementRef, TemplateRef, ModuleWithProviders, OnInit, OnDestroy, InputSignal, InputSignalWithTransform, QueryList, AfterViewInit, PipeTransform, AfterContentInit, AfterContentChecked, ModelSignal, ChangeDetectorRef, ViewContainerRef, OutputEmitterRef, OnChanges, SimpleChanges, Renderer2, WritableSignal, EventEmitter, ComponentRef, Injector, NgModuleRef } from '@angular/core';
 import { AnimationEvent } from '@angular/animations';
 import * as rxjs from 'rxjs';
-import { Observable, Subscription, BehaviorSubject } from 'rxjs';
+import { Observable, Subscription, Subject, BehaviorSubject } from 'rxjs';
 import { FocusableOption, FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';
 import { ControlValueAccessor, FormGroup, FormControl } from '@angular/forms';
 import { BooleanInput as BooleanInput$1, NumberInput as NumberInput$1 } from '@angular/cdk/coercion';
 import * as _popperjs_core from '@popperjs/core';
-import { Options, Placement } from '@popperjs/core';
+import { Options, Placement, Modifier } from '@popperjs/core';
 import { CdkVirtualScrollViewport } from '@angular/cdk/scrolling';
+import { SelectionModel, SelectionChange } from '@angular/cdk/collections';
 
 declare type BooleanInput = string | boolean | null | undefined;
 declare type NumberInput = string | number | null | undefined;
@@ -2700,28 +2701,11 @@ declare class MultiSelectOptgroupComponent implements AfterContentInit, OnChange
     static ngAcceptInputType_disabled: unknown;
 }
 
-type SearchFn = ((option: IOption, searchValue: string) => boolean);
+type SearchFn = (option: IOption, searchValue: string) => boolean;
 interface IMultiSelect<T> {
-    cleaner?: boolean | 'active';
-    multiple?: boolean;
-    options?: IOption[];
-    optionsMaxHeight?: (number | string | 'auto');
-    optionsStyle?: (string | 'checkbox' | 'text');
-    placeholder?: string;
-    search?: boolean | 'external' | SearchFn;
-    searchValue?: string;
-    searchValueChange?: EventEmitter<string>;
-    searchNoResultsLabel?: string;
-    selectAll?: boolean;
-    selectAllLabel?: string;
-    selectionType?: ('counter' | 'tags' | 'text');
-    selectionTypeCounterText?: string;
     value: T | T[];
-    valueChange: EventEmitter<T | T[]>;
-    virtualScroller?: boolean;
-    visibleItems?: number;
-    visible?: boolean;
-    visibleChange?: EventEmitter<boolean>;
+    valueChange: OutputEmitterRef<T | T[]>;
+    [k: string]: any;
 }
 type TOptions = IOption[];
 interface IOption {
@@ -2737,24 +2721,56 @@ interface IOption {
     custom?: boolean;
 }
 
+declare class MultiSelectService {
+    #private;
+    optionsStyle: 'checkbox' | 'text';
+    selectionModel: SelectionModel<any>;
+    readonly selectionModelChanged$: Subject<SelectionChange<any>>;
+    setSelectionModel(multiple?: boolean, initiallySelectedValues?: string[]): void;
+    private readonly multiSelectVisible;
+    readonly multiSelectVisible$: rxjs.Observable<boolean>;
+    toggleVisible(visible: boolean): void;
+    private readonly multiSelectFocus;
+    readonly multiSelectFocus$: rxjs.Observable<MultiSelectOptionComponent>;
+    focusChange(option: MultiSelectOptionComponent): void;
+    readonly userOptionsSignal: _angular_core.WritableSignal<IOption[]>;
+    getUserOptions(): _angular_core.Signal<IOption[]>;
+    addUserOption(option: IOption): void;
+    removeUserOption(value: string): void;
+    removeAllUserOptions(): void;
+    readonly optionsArray$: rxjs.Observable<IOption[]>;
+    getOptionsArray(): rxjs.Observable<IOption[]>;
+    updateOptionsArray(options: IOption[]): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiSelectService, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<MultiSelectService>;
+}
+
 interface IPluralMap {
     [k: string]: string;
 }
 declare class MultiSelectComponent<TValue extends string | number> implements IMultiSelect<TValue>, ControlValueAccessor, AfterViewInit, OnChanges, OnDestroy, OnInit {
     #private;
+    static ngAcceptInputType_allowCreateOptions: BooleanInput$1;
+    static ngAcceptInputType_clearSearchOnSelect: BooleanInput$1;
+    static ngAcceptInputType_disabled: BooleanInput$1;
+    static ngAcceptInputType_itemSize: NumberInput$1;
+    static ngAcceptInputType_itemMinWidthInput: NumberInput$1;
+    static ngAcceptInputType_loading: BooleanInput$1;
+    static ngAcceptInputType_multiple: BooleanInput$1;
+    static ngAcceptInputType_selectAll: BooleanInput$1;
+    static ngAcceptInputType_virtualScroller: BooleanInput$1;
+    static ngAcceptInputType_visibleInput: BooleanInput$1;
     private readonly elementRef;
     private readonly renderer;
     private readonly ngZone;
     private readonly changeDetectorRef;
-    private readonly viewContainerRef;
     private readonly focusMonitor;
-    private readonly multiSelectService;
+    protected readonly multiSelectService: MultiSelectService;
     private readonly iterableDiffers;
     constructor();
     private readonly differ;
-    readonly optionsArray$: Observable<IOption[]>;
     readonly userOptionsArray$: BehaviorSubject<IOption[]>;
-    readonly optionsSelected$: BehaviorSubject<IOption[]>;
+    readonly optionTags: _angular_core.WritableSignal<IOption[]>;
     readonly optionsSelected: Map<any, IOption>;
     readonly value$: BehaviorSubject<TValue[]>;
     onChange: (value: any) => void;
@@ -2765,66 +2781,44 @@ declare class MultiSelectComponent<TValue extends string | number> implements IM
     setDisabledState(isDisabled: boolean): void;
     /**
      * Allow users to create options if they are not in the list of options.
-     * @type boolean
+     * @return boolean
      * @default false
      * @since 4.5.11
      */
-    allowCreateOptions: boolean;
+    readonly allowCreateOptions: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * Enables selection cleaner element
-     * @type boolean
+     * @return boolean
      * @default true | 'active'
      */
-    cleaner: boolean | 'active';
+    readonly cleaner: _angular_core.InputSignal<boolean | "active">;
     /**
      * Clear current search on selecting an item
-     * @type boolean
+     * @return boolean
      * @default false
      * @since 4.5.11
      */
-    clearSearchOnSelect: boolean;
+    readonly clearSearchOnSelect: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * Disables multi-select component
-     * @type boolean
+     * @return boolean
      * @default false
      */
-    set disabled(value: boolean);
-    get disabled(): boolean;
-    private _disabled;
+    readonly disabledInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly disabled: _angular_core.WritableSignal<boolean>;
     /**
      * Add loading spinner and reduced opacity.
-     * @type boolean
+     * @return boolean
      * @default false
      * @since 4.5.2
      */
-    set loading(value: boolean);
-    isLoading: _angular_core.WritableSignal<boolean>;
+    readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * Specifies that multiple options can be selected at once
-     * @type boolean
+     * @returns boolean
      * @default false
      */
-    set multiple(value: boolean);
-    get multiple(): boolean;
-    private _multiple;
-    /**
-     * Hidden native select form
-     * @type string
-     * @default ''
-     */
-    nativeFormId: string;
-    /**
-     * Hidden native select id
-     * @type string
-     * @default ''
-     */
-    nativeId: string;
-    /**
-     * Hidden native select name
-     * @type string
-     * @default ''
-     */
-    nativeName: string;
+    readonly multiple: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * List of option elements
      * @type IOption[]
@@ -2834,34 +2828,35 @@ declare class MultiSelectComponent<TValue extends string | number> implements IM
     get options(): IOption[];
     /**
      * Sets maxHeight of options list in px
-     * @type string | number
+     * @return string | number
      * @default 'auto'
      */
-    optionsMaxHeight: string | number;
+    readonly optionsMaxHeightInput: _angular_core.InputSignal<string | number>;
+    readonly optionsMaxHeight: _angular_core.WritableSignal<string | number>;
     /**
      * Sets option style
-     * @type 'checkbox' | 'text'
+     * @return 'checkbox' | 'text'
      * @default 'checkbox'
      */
-    set optionsStyle(value: 'checkbox' | 'text');
+    readonly optionsStyle: _angular_core.InputSignal<"text" | "checkbox">;
     /**
      * Specifies a short hint that is visible in the search input
-     * @type string
+     * @return string
      * @default 'Select...'
      */
-    placeholder: string;
+    readonly placeholder: _angular_core.InputSignal<string>;
     /**
      * Enables search input element
-     * @type boolean | SearchFn | 'external'
+     * @return boolean | SearchFn | 'external'
      * @default true
      */
-    search: boolean | 'external' | SearchFn;
+    readonly search: _angular_core.InputSignal<boolean | SearchFn | "external">;
     /**
      * Sets the label for no results when filtering
-     * @type string
+     * @return string
      * @default 'no items'
      */
-    searchNoResultsLabel: string;
+    readonly searchNoResultsLabel: _angular_core.InputSignal<string>;
     /**
      * Sets initial search string
      * @type string
@@ -2872,44 +2867,44 @@ declare class MultiSelectComponent<TValue extends string | number> implements IM
     private _searchValue;
     /**
      * Emits searchValue string for external filtering
-     * @type string
+     * @return string
      */
-    readonly searchValueChange: EventEmitter<string>;
+    readonly searchValueChange: _angular_core.OutputEmitterRef<string>;
     /**
      * Enables select all button
-     * @type boolean
+     * @return boolean
      * @default true
      */
-    selectAll: boolean;
+    readonly selectAll: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * Sets the select all button label
-     * @type string
+     * @return string
      * @default 'Select all options'
      */
-    selectAllLabel: string;
+    readonly selectAllLabel: _angular_core.InputSignal<string>;
     /**
      * Selection type
-     * @type 'counter' | 'tags' | 'text'
+     * @return 'counter' | 'tags' | 'text'
      * @default 'tags'
      */
-    selectionType: 'counter' | 'tags' | 'text';
+    readonly selectionType: _angular_core.InputSignal<"text" | "counter" | "tags">;
     /**
      * Counter selection label value
-     * @type string
+     * @return string
      * @default 'item(s) selected'
      */
-    selectionTypeCounterText: string;
+    readonly selectionTypeCounterText: _angular_core.InputSignal<string>;
     /**
      * Counter selection label plural map for I18nPluralPipe
-     * @type IPluralMap
+     * @return IPluralMap
      * @default { '=1': 'item selected', 'other': 'items selected' }
      */
-    selectionTypeCounterTextPluralMap?: IPluralMap;
+    readonly selectionTypeCounterTextPluralMap: _angular_core.InputSignal<IPluralMap | undefined>;
     /**
      * Size the component small or large.
-     * @type 'sm' | 'lg' | undefined
+     * @return 'sm' | 'lg' | undefined
      */
-    size?: 'sm' | 'lg';
+    readonly size: _angular_core.InputSignal<"sm" | "lg" | undefined>;
     /**
      * Initial value of multi-select
      * @type (TValue | TValue[])
@@ -2918,63 +2913,65 @@ declare class MultiSelectComponent<TValue extends string | number> implements IM
     get value(): TValue | TValue[];
     /**
      * Emits valueChange
-     * @type TValue | TValue[]
+     * @return TValue | TValue[]
      */
-    readonly valueChange: EventEmitter<TValue | TValue[]>;
+    readonly valueChange: _angular_core.OutputEmitterRef<TValue | TValue[]>;
     /**
      * Toggle visual validation feedback.
-     * @type boolean | undefined
+     * @return boolean | undefined
      * @default undefined
      */
-    valid?: boolean;
+    readonly valid: _angular_core.InputSignal<boolean | undefined>;
     /**
      * Enable virtual scroller for options list.
-     * @type boolean
+     * @return boolean
      * @default false
      */
-    set virtualScroller(value: boolean);
-    get virtualScroller(): boolean;
-    private _virtualScroller;
+    readonly virtualScroller: _angular_core.InputSignalWithTransform<boolean, unknown>;
     /**
      * Amount of visible options, if set - overwrites optionsMaxHeight
-     * @type number
+     * @return number
      * @default 8
      */
-    set visibleItems(value: number);
-    get visibleItems(): number;
-    private _visibleItems;
+    readonly visibleItemsInput: _angular_core.InputSignalWithTransform<number, unknown>;
+    readonly visibleItems: _angular_core.Signal<number>;
     /**
      * The size of the option item in the list (in pixels).
-     * @type number
+     * @return number
      * @default 40
      */
-    itemSize: number;
+    readonly itemSize: _angular_core.InputSignalWithTransform<number, unknown>;
     /**
      * Min width of the options list (in pixels).
-     * @type number
+     * @return number
      * @default 196
      */
-    itemMinWidth: number;
+    readonly itemMinWidthInput: _angular_core.InputSignalWithTransform<number, unknown>;
+    readonly itemMinWidth: _angular_core.WritableSignal<number>;
     readonly minWidth: _angular_core.WritableSignal<number>;
     /**
      * Toggle the visibility of the dropdown select component.
      * @type boolean
      * @default false
      */
-    set visible(value: boolean);
-    get visible(): boolean;
-    private _visible;
+    readonly visibleInput: _angular_core.InputSignalWithTransform<boolean, unknown>;
+    readonly visible: _angular_core.WritableSignal<boolean>;
     /**
      * Emits visibleChange
-     * @type boolean
+     * @return boolean
      */
-    readonly visibleChange: EventEmitter<boolean>;
+    readonly visibleChange: _angular_core.OutputEmitterRef<boolean>;
     /**
      * Optional popper Options object
      * @type Partial<Options>
      */
-    set popperOptions(options: Partial<Options>);
-    get popperOptions(): Partial<Options>;
+    readonly popperOptionsInput: _angular_core.InputSignal<Partial<Options>>;
+    readonly popperOptions: _angular_core.Signal<{
+        placement?: _popperjs_core.Placement | undefined;
+        modifiers?: Partial<Modifier<any, any>>[] | undefined;
+        strategy?: _popperjs_core.PositioningStrategy | undefined;
+        onFirstUpdate?: (arg0: Partial<_popperjs_core.State>) => void;
+    }>;
     isDropdownVisible: boolean;
     get selectedOptions(): IOption[];
     get selectedOptionsText(): string;
@@ -2996,26 +2993,9 @@ declare class MultiSelectComponent<TValue extends string | number> implements IM
     dropdownMenu: ElementRef;
     dropdown: ElementRef;
     dropdownToggle: ElementRef;
-    get hostClasses(): {
-        disabled: boolean;
-        'is-valid': boolean;
-        'is-invalid': boolean;
-    };
-    get multiselectClasses(): {
-        [x: string]: boolean;
-        'form-multi-select': boolean;
-        show: boolean;
-        disabled: boolean;
-        'is-valid': boolean;
-        'is-invalid': boolean;
-    };
-    get multiselectSelectionClasses(): {
-        'form-multi-select-selection': boolean;
-        'form-multi-select-selection-tags': number | false;
-        'form-control': boolean;
-        'is-valid': boolean;
-        'is-invalid': boolean;
-    };
+    readonly hostClasses: _angular_core.Signal<Record<string, boolean>>;
+    get multiselectClasses(): Record<string, boolean>;
+    get multiselectSelectionClasses(): Record<string, boolean>;
     private get ariaMultiSelectable();
     private get ariaExpanded();
     private get tabIndex();
@@ -3029,7 +3009,6 @@ declare class MultiSelectComponent<TValue extends string | number> implements IM
     get subtreeFocused(): boolean;
     set subtreeFocused(focused: boolean);
     private _subtreeFocused;
-    private nativeSelectRef;
     focusOrigin(origin: FocusOrigin): boolean;
     ngOnInit(): void;
     ngOnDestroy(): void;
@@ -3046,8 +3025,6 @@ declare class MultiSelectComponent<TValue extends string | number> implements IM
     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 setFocusMonitor;
@@ -3064,15 +3041,7 @@ declare class MultiSelectComponent<TValue extends string | number> implements IM
     updateActiveItem<TItem extends MultiSelectOptionComponent & FocusableOption>(item: TItem): void;
     handleIndicatorClick($event: MouseEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiSelectComponent<any>, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MultiSelectComponent<any>, "c-multi-select", ["cMultiSelect"], { "allowCreateOptions": { "alias": "allowCreateOptions"; "required": false; }; "cleaner": { "alias": "cleaner"; "required": false; }; "clearSearchOnSelect": { "alias": "clearSearchOnSelect"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "loading": { "alias": "loading"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "nativeFormId": { "alias": "nativeFormId"; "required": false; }; "nativeId": { "alias": "nativeId"; "required": false; }; "nativeName": { "alias": "nativeName"; "required": false; }; "options": { "alias": "options"; "required": false; }; "optionsMaxHeight": { "alias": "optionsMaxHeight"; "required": false; }; "optionsStyle": { "alias": "optionsStyle"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "search": { "alias": "search"; "required": false; }; "searchNoResultsLabel": { "alias": "searchNoResultsLabel"; "required": false; }; "searchValue": { "alias": "searchValue"; "required": false; }; "selectAll": { "alias": "selectAll"; "required": false; }; "selectAllLabel": { "alias": "selectAllLabel"; "required": false; }; "selectionType": { "alias": "selectionType"; "required": false; }; "selectionTypeCounterText": { "alias": "selectionTypeCounterText"; "required": false; }; "selectionTypeCounterTextPluralMap": { "alias": "selectionTypeCounterTextPluralMap"; "required": false; }; "size": { "alias": "size"; "required": false; }; "value": { "alias": "value"; "required": false; }; "valid": { "alias": "valid"; "required": false; }; "virtualScroller": { "alias": "virtualScroller"; "required": false; }; "visibleItems": { "alias": "visibleItems"; "required": false; }; "itemSize": { "alias": "itemSize"; "required": false; }; "itemMinWidth": { "alias": "itemMinWidth"; "required": false; }; "visible": { "alias": "visible"; "required": false; }; "popperOptions": { "alias": "popperOptions"; "required": false; }; }, { "searchValueChange": "searchValueChange"; "valueChange": "valueChange"; "visibleChange": "visibleChange"; }, ["multiSelectOptionsContent", "contentTemplates"], ["*"], true, never>;
-    static ngAcceptInputType_allowCreateOptions: unknown;
-    static ngAcceptInputType_clearSearchOnSelect: unknown;
-    static ngAcceptInputType_disabled: unknown;
-    static ngAcceptInputType_loading: unknown;
-    static ngAcceptInputType_multiple: unknown;
-    static ngAcceptInputType_virtualScroller: unknown;
-    static ngAcceptInputType_visibleItems: unknown;
-    static ngAcceptInputType_visible: unknown;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MultiSelectComponent<any>, "c-multi-select", ["cMultiSelect"], { "allowCreateOptions": { "alias": "allowCreateOptions"; "required": false; "isSignal": true; }; "cleaner": { "alias": "cleaner"; "required": false; "isSignal": true; }; "clearSearchOnSelect": { "alias": "clearSearchOnSelect"; "required": false; "isSignal": true; }; "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; }; "optionsMaxHeightInput": { "alias": "optionsMaxHeight"; "required": false; "isSignal": true; }; "optionsStyle": { "alias": "optionsStyle"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "search": { "alias": "search"; "required": false; "isSignal": true; }; "searchNoResultsLabel": { "alias": "searchNoResultsLabel"; "required": false; "isSignal": true; }; "searchValue": { "alias": "searchValue"; "required": false; }; "selectAll": { "alias": "selectAll"; "required": false; "isSignal": true; }; "selectAllLabel": { "alias": "selectAllLabel"; "required": false; "isSignal": true; }; "selectionType": { "alias": "selectionType"; "required": false; "isSignal": true; }; "selectionTypeCounterText": { "alias": "selectionTypeCounterText"; "required": false; "isSignal": true; }; "selectionTypeCounterTextPluralMap": { "alias": "selectionTypeCounterTextPluralMap"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; "valid": { "alias": "valid"; "required": false; "isSignal": true; }; "virtualScroller": { "alias": "virtualScroller"; "required": false; "isSignal": true; }; "visibleItemsInput": { "alias": "visibleItems"; "required": false; "isSignal": true; }; "itemSize": { "alias": "itemSize"; "required": false; "isSignal": true; }; "itemMinWidthInput": { "alias": "itemMinWidth"; "required": false; "isSignal": true; }; "visibleInput": { "alias": "visible"; "required": false; "isSignal": true; }; "popperOptionsInput": { "alias": "popperOptions"; "required": false; "isSignal": true; }; }, { "searchValueChange": "searchValueChange"; "valueChange": "valueChange"; "visibleChange": "visibleChange"; }, ["multiSelectOptionsContent", "contentTemplates"], ["*"], true, never>;
 }
 
 declare class MultiSelectModule {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coreui/angular-pro",
-  "version": "5.5.8",
+  "version": "5.5.9",
   "description": "CoreUI Pro Components Library for Angular",
   "copyright": "Copyright 2025 creativeLabs Łukasz Holeczek",
   "homepage": "https://coreui.io/angular",
@@ -29,7 +29,7 @@
     "@angular/forms": "^20.1.0",
     "@angular/router": "^20.1.0",
     "@coreui/coreui-pro": "~5.18.0",
-    "@coreui/icons-angular": "~5.5.8",
+    "@coreui/icons-angular": "~5.5.9",
     "rxjs": "^7.8.2"
   },
   "repository": {