@ardium-ui/ui 5.0.0-alpha.10 → 5.0.0-alpha.100

package/lib/inputs/password-input/password-input.component.d.ts

@@ -14,7 +14,6 @@ export declare class ArdiumPasswordInputComponent extends _FormFieldComponentBas
     readonly textInputEl: import("@angular/core").Signal<ElementRef<HTMLInputElement> | undefined>;
     ngOnInit(): void;
     readonly placeholder: import("@angular/core").InputSignal<string>;
-    readonly inputId: import("@angular/core").InputSignal<Nullable<string>>;
     readonly prefixTemplate: import("@angular/core").Signal<ArdPasswordInputPrefixTemplateDirective | undefined>;
     readonly suffixTemplate: import("@angular/core").Signal<ArdPasswordInputSuffixTemplateDirective | undefined>;
     readonly placeholderTemplate: import("@angular/core").Signal<ArdPasswordInputPlaceholderTemplateDirective | undefined>;
@@ -25,6 +24,7 @@ export declare class ArdiumPasswordInputComponent extends _FormFieldComponentBas
     readonly revealed: import("@angular/core").ModelSignal<boolean>;
     private _hideTimeout;
     toggleReveal(newState?: boolean): void;
+    onMouseUp(): void;
     ngOnDestroy(): void;
     readonly revealTemplate: import("@angular/core").Signal<ArdPasswordInputRevealButtonTemplateDirective | undefined>;
     readonly revealButtonContext: import("@angular/core").Signal<PasswordInputRevealButtonContext>;
@@ -34,13 +34,13 @@ export declare class ArdiumPasswordInputComponent extends _FormFieldComponentBas
     readonly ngClasses: import("@angular/core").Signal<string>;
     readonly inputAttrs: import("@angular/core").InputSignal<Record<string, any>>;
     writeValue(v: any): void;
-    protected _writeValue(v: string | null | undefined): boolean;
-    readonly value: import("@angular/core").ModelSignal<Nullable<string>>;
+    protected _writeValue(v: string | null): boolean;
+    readonly value: import("@angular/core").ModelSignal<string | null>;
     onInput(newVal: string): void;
     protected _emitChange(): void;
     onChange(event: Event): void;
     onCopy(event: ClipboardEvent): void;
     protected _setInputAttributes(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumPasswordInputComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumPasswordInputComponent, "ard-password-input", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "revealable": { "alias": "revealable"; "required": false; "isSignal": true; }; "holdToReveal": { "alias": "holdToReveal"; "required": false; "isSignal": true; }; "autoHideTimeoutMs": { "alias": "autoHideTimeoutMs"; "required": false; "isSignal": true; }; "revealed": { "alias": "revealed"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "inputAttrs": { "alias": "inputAttrs"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "revealed": "revealedChange"; "value": "valueChange"; }, ["prefixTemplate", "suffixTemplate", "placeholderTemplate", "revealTemplate"], never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumPasswordInputComponent, "ard-password-input", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "revealable": { "alias": "revealable"; "required": false; "isSignal": true; }; "holdToReveal": { "alias": "holdToReveal"; "required": false; "isSignal": true; }; "autoHideTimeoutMs": { "alias": "autoHideTimeoutMs"; "required": false; "isSignal": true; }; "revealed": { "alias": "revealed"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "inputAttrs": { "alias": "inputAttrs"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "revealed": "revealedChange"; "value": "valueChange"; }, ["prefixTemplate", "suffixTemplate", "placeholderTemplate", "revealTemplate"], never, false, never>;
 }

package/lib/modal/modal.component.d.ts

@@ -14,6 +14,8 @@ export declare class ArdiumModalComponent {
     readonly ngClasses: import("@angular/core").Signal<string>;
     readonly heading: import("@angular/core").InputSignal<string>;
     readonly noCloseButton: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
+    readonly panelClass: import("@angular/core").InputSignal<string>;
+    readonly backdropClass: import("@angular/core").InputSignal<string>;
     readonly noBackdrop: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly disableBackdropClose: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly allActionsDisabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
@@ -32,5 +34,5 @@ export declare class ArdiumModalComponent {
     readonly closeIconTemplate: import("@angular/core").Signal<ArdModalCloseIconTemplateDirective | undefined>;
     readonly _closeIconTemplate: import("@angular/core").InputSignal<ArdModalCloseIconTemplateDirective | undefined>;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumModalComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumModalComponent, "ard-modal", never, { "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "noCloseButton": { "alias": "noCloseButton"; "required": false; "isSignal": true; }; "noBackdrop": { "alias": "noBackdrop"; "required": false; "isSignal": true; }; "disableBackdropClose": { "alias": "disableBackdropClose"; "required": false; "isSignal": true; }; "allActionsDisabled": { "alias": "allActionsDisabled"; "required": false; "isSignal": true; }; "_open": { "alias": "open"; "required": false; }; "_closeIconTemplate": { "alias": "_closeIconTemplate"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; "closeEvent": "close"; }, ["closeIconTemplate"], ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumModalComponent, "ard-modal", never, { "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "noCloseButton": { "alias": "noCloseButton"; "required": false; "isSignal": true; }; "panelClass": { "alias": "panelClass"; "required": false; "isSignal": true; }; "backdropClass": { "alias": "backdropClass"; "required": false; "isSignal": true; }; "noBackdrop": { "alias": "noBackdrop"; "required": false; "isSignal": true; }; "disableBackdropClose": { "alias": "disableBackdropClose"; "required": false; "isSignal": true; }; "allActionsDisabled": { "alias": "allActionsDisabled"; "required": false; "isSignal": true; }; "_open": { "alias": "open"; "required": false; }; "_closeIconTemplate": { "alias": "_closeIconTemplate"; "required": false; "isSignal": true; }; }, { "openChange": "openChange"; "closeEvent": "close"; }, ["closeIconTemplate"], ["*"], false, never>;
 }

package/lib/modal/modal.defaults.d.ts

@@ -8,6 +8,8 @@ export interface ArdModalDefaults {
     noCloseButton: boolean;
     noBackdrop: boolean;
     disableBackdropClose: boolean;
+    panelClass: string;
+    backdropClass: string;
 }
 export declare const _modalDefaults: ArdModalDefaults;
 export declare const ARD_MODAL_DEFAULTS: InjectionToken<ArdModalDefaults>;

package/lib/radio/radio/radio.component.d.ts

@@ -12,18 +12,23 @@ export declare class ArdiumRadioComponent extends _FocusableComponentBase {
      * Emits all select-state-related events.
      */
     protected _emitChange(): void;
+    protected _emitTouched(): void;
     /**
      * The event emitter responsible for firing `select` events. Fired when the `selected` state is set to true.
      */
-    readonly selectEvent: import("@angular/core").OutputEmitterRef<null>;
+    readonly selectEvent: import("@angular/core").OutputEmitterRef<void>;
     /**
      * The event emitter responsible for firing `unselect` events. Fired when the `selected` state is set to false.
      */
-    readonly unselectEvent: import("@angular/core").OutputEmitterRef<null>;
+    readonly unselectEvent: import("@angular/core").OutputEmitterRef<void>;
     /**
      * The event emitter responsible for firing `change` events. Fired when the `selected` state is changed.
      */
     readonly changeEvent: import("@angular/core").OutputEmitterRef<boolean>;
+    /**
+     * The event emitter responsible for firing `touched` events. Fired when the component is marked as touched (e.g., on blur).
+     */
+    readonly touchedEvent: import("@angular/core").OutputEmitterRef<void>;
     readonly selected: import("@angular/core").WritableSignal<boolean>;
     /**
      * The selection state of the component. Coercible into a boolean.
@@ -59,5 +64,5 @@ export declare class ArdiumRadioComponent extends _FocusableComponentBase {
      */
     markForCheck(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumRadioComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRadioComponent, "ard-radio", never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "_selected": { "alias": "selected"; "required": false; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, { "selectEvent": "select"; "unselectEvent": "unselect"; "changeEvent": "change"; "selectedChange": "selectedChange"; }, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRadioComponent, "ard-radio", never, { "htmlId": { "alias": "htmlId"; "required": false; "isSignal": true; }; "_selected": { "alias": "selected"; "required": false; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, { "selectEvent": "select"; "unselectEvent": "unselect"; "changeEvent": "change"; "touchedEvent": "touched"; "selectedChange": "selectedChange"; }, never, ["*"], false, never>;
 }

package/lib/radio/radio-group.component.d.ts

@@ -23,8 +23,9 @@ export declare class ArdiumRadioGroupComponent extends _FormFieldComponentBase i
     readonly selected: import("@angular/core").ModelSignal<Nullable<ArdiumRadioComponent>>;
     private _checkSelectedRadioButton;
     /** Name of the radio button group. All radio buttons inside this group will use this name. */
-    readonly name: import("@angular/core").InputSignal<string>;
+    readonly name: import("@angular/core").Signal<string>;
     private _updateRadioButtonNames;
+    private _updateReadonlyRadioButtons;
     private _handleBlurEvents;
     private _handleFocusEvents;
     private _handleChangeEvents;
@@ -35,5 +36,5 @@ export declare class ArdiumRadioGroupComponent extends _FormFieldComponentBase i
     ngOnDestroy(): void;
     private _destroyChildSubscriptions;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumRadioGroupComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRadioGroupComponent, "ard-radio-group", never, { "value": { "alias": "value"; "required": false; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; "selected": "selectedChange"; }, ["_radios"], ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRadioGroupComponent, "ard-radio-group", never, { "value": { "alias": "value"; "required": false; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; "selected": "selectedChange"; }, ["_radios"], ["*"], false, never>;
 }

package/lib/search-functions.d.ts

@@ -1,5 +1,5 @@
 import { SearchFn } from './types/item-storage.types';
-export declare function searchInString(searchTerm: string, toSearch: any): boolean;
+export declare function searchInString(searchTerm: string, toSearch: string): boolean;
 export declare const searchFunctions: {
     byLabel: SearchFn;
     byValue: SearchFn;

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

@@ -1,17 +1,18 @@
 import { AfterContentInit, AfterViewInit, ElementRef, OnChanges, OnDestroy, OnInit, QueryList, Signal, SimpleChanges, TemplateRef } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 import { BooleanLike, NumberLike } from '@ardium-ui/devkit';
+import { Observable } from 'rxjs';
 import { _FormFieldComponentBase } from '../_internal/form-field-component';
 import { ItemStorage, ItemStorageHost } from '../_internal/item-storages/dropdown-item-storage';
 import { ArdiumDropdownPanelComponent } from '../dropdown-panel/dropdown-panel.component';
 import { DropdownPanelAppearance, DropdownPanelVariant } from '../dropdown-panel/dropdown-panel.types';
 import { ArdiumOptionComponent } from '../option/option.component';
-import { ArdOption, ArdOptionGroup, ArdPanelPosition, GroupByFn, OptionContext, SearchFn } from '../types/item-storage.types';
+import { ArdOption, ArdOptionGroup, ArdPanelPosition, CompareWithFn, GroupByFn, OptionContext, SearchFn } from '../types/item-storage.types';
 import { FormElementAppearance } from '../types/theming.types';
 import { Nullable } from '../types/utility.types';
 import { FormElementVariant } from './../types/theming.types';
 import { ArdSelectDefaults } from './select.defaults';
-import { ArdAddCustomTemplateDirective, ArdDropdownFooterTemplateDirective, ArdDropdownHeaderTemplateDirective, ArdItemDisplayLimitTemplateDirective, ArdItemLimitReachedTemplateDirective, ArdLoadingPlaceholderTemplateDirective, ArdLoadingSpinnerTemplateDirective, ArdNoItemsFoundTemplateDirective, ArdOptgroupTemplateDirective, ArdOptionTemplateDirective, ArdSelectPlaceholderTemplateDirective, ArdSelectPrefixTemplateDirective, ArdSelectSuffixTemplateDirective, ArdValueTemplateDirective } from './select.directive';
+import { ArdAddCustomTemplateDirective, ArdDropdownFooterTemplateDirective, ArdDropdownHeaderTemplateDirective, ArdItemDisplayLimitTemplateDirective, ArdItemLimitReachedTemplateDirective, ArdLoadingPlaceholderTemplateDirective, ArdLoadingSpinnerTemplateDirective, ArdNoItemsFoundTemplateDirective, ArdOptgroupTemplateDirective, ArdOptionTemplateDirective, ArdSelectDropdownArrowTemplateDirective, ArdSelectPlaceholderTemplateDirective, ArdSelectPrefixTemplateDirective, ArdSelectSuffixTemplateDirective, ArdValueTemplateDirective } from './select.directive';
 import { AddCustomFn, CustomOptionContext, GroupContext, ItemDisplayLimitContext, ItemLimitContext, PlaceholderContext, SearchContext, StatsContext, ValueContext } from './select.types';
 import * as i0 from "@angular/core";
 export declare class ArdiumSelectComponent extends _FormFieldComponentBase implements OnChanges, AfterViewInit, AfterContentInit, OnInit, OnDestroy, ControlValueAccessor, ItemStorageHost {
@@ -23,7 +24,7 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     private readonly _isMouseBeingUsed;
     private readonly _searchBarFocused;
     private readonly _destroy$;
-    readonly searchTerm: import("@angular/core").WritableSignal<string>;
+    readonly searchTerm: import("@angular/core").ModelSignal<string>;
     isItemsInputUsed: boolean;
     readonly valueFrom: import("@angular/core").InputSignal<string>;
     readonly labelFrom: import("@angular/core").InputSignal<string>;
@@ -36,10 +37,13 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     readonly clearButtonTitle: import("@angular/core").InputSignal<string>;
     readonly dropdownPosition: import("@angular/core").InputSignal<ArdPanelPosition>;
     readonly noItemsFoundText: import("@angular/core").InputSignal<string>;
+    readonly addCustomOptionText: import("@angular/core").InputSignal<string>;
     readonly loadingPlaceholderText: import("@angular/core").InputSignal<string>;
     readonly searchInputId: import("@angular/core").InputSignal<Nullable<string>>;
     readonly inputAttrs: import("@angular/core").InputSignal<Record<string, any>>;
     readonly isLoading: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
+    readonly _deferValueWrites: import("@angular/core").InputSignal<boolean | null>;
+    readonly deferValueWrites: Signal<boolean>;
     readonly itemsAlreadyGrouped: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly invertDisabled: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly noGroupActions: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
@@ -48,13 +52,18 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     readonly keepOpen: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly hideSelected: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly noBackspaceClear: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
-    readonly sortMultipleValues: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly searchCaseSensitive: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly keepSearchAfterSelect: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly maxSelectedItems: import("@angular/core").InputSignalWithTransform<number, NumberLike>;
     readonly itemDisplayLimit: import("@angular/core").InputSignalWithTransform<number, NumberLike>;
-    readonly searchFn: import("@angular/core").InputSignal<SearchFn>;
-    readonly compareWith: import("@angular/core").InputSignal<Nullable<SearchFn>>;
+    /**
+     * The function used to search for matching items based on the search term.
+     *
+     * When set to `null`, the search functionality will be disabled (all items will be shown),
+     * but the `searchEvent` will still be emitted with the search term whenever it changes.
+     */
+    readonly searchFn: import("@angular/core").InputSignal<SearchFn | null>;
+    readonly compareWith: import("@angular/core").InputSignal<Nullable<CompareWithFn>>;
     readonly appearance: import("@angular/core").InputSignal<FormElementAppearance>;
     readonly variant: import("@angular/core").InputSignal<FormElementVariant>;
     readonly compact: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
@@ -73,18 +82,17 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     readonly searchable: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
     readonly filtered: Signal<boolean>;
     readonly touched: import("@angular/core").WritableSignal<boolean>;
-    private _defaultAddCustomFn;
-    readonly addCustom: import("@angular/core").InputSignalWithTransform<false | AddCustomFn<any> | AddCustomFn<Promise<any>>, string | boolean | AddCustomFn<any> | AddCustomFn<Promise<any>>>;
+    private readonly _defaultAddCustomFn;
+    readonly addCustom: import("@angular/core").InputSignalWithTransform<false | AddCustomFn<any> | AddCustomFn<Promise<any>> | AddCustomFn<Observable<any>>, string | boolean | AddCustomFn<any> | AddCustomFn<Promise<any>> | AddCustomFn<Observable<any>>>;
     readonly shouldShowAddCustom: Signal<boolean>;
     addCustomOption(value: string): Promise<void>;
     setDisabledState(state: boolean): void;
     writeValue(ngModel: any[]): void;
     protected _emitChange(): void;
-    private _onTouched;
+    protected _emitTouched(): void;
     set value(newValue: any);
     get value(): Signal<any[]>;
     readonly valueChange: import("@angular/core").OutputEmitterRef<any[]>;
-    readonly changeEvent: import("@angular/core").OutputEmitterRef<any[]>;
     readonly addEvent: import("@angular/core").OutputEmitterRef<any[]>;
     readonly failedToAddEvent: import("@angular/core").OutputEmitterRef<any[]>;
     readonly removeEvent: import("@angular/core").OutputEmitterRef<any[]>;
@@ -96,10 +104,6 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
         end: number;
     }>;
     readonly scrollToEndEvent: import("@angular/core").OutputEmitterRef<void>;
-    readonly searchEvent: import("@angular/core").OutputEmitterRef<{
-        search: string;
-        matching: any[];
-    }>;
     readonly isOpen: import("@angular/core").ModelSignal<boolean>;
     readonly searchInput: Signal<ElementRef<HTMLInputElement> | undefined>;
     readonly dropdownPanel: Signal<ArdiumDropdownPanelComponent | undefined>;
@@ -107,6 +111,7 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     readonly optgroupTemplate: Signal<ArdOptgroupTemplateDirective | undefined>;
     readonly valueTemplate: Signal<ArdValueTemplateDirective | undefined>;
     readonly placeholderTemplate: Signal<ArdSelectPlaceholderTemplateDirective | undefined>;
+    readonly dropdownArrowTemplate: Signal<ArdSelectDropdownArrowTemplateDirective | undefined>;
     readonly loadingSpinnerTemplate: Signal<ArdLoadingSpinnerTemplateDirective | undefined>;
     readonly loadingPlaceholderTemplate: Signal<ArdLoadingPlaceholderTemplateDirective | undefined>;
     readonly dropdownHeaderTemplate: Signal<ArdDropdownHeaderTemplateDirective | undefined>;
@@ -117,13 +122,13 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     readonly itemDisplayLimitTemplate: Signal<ArdItemDisplayLimitTemplateDirective | undefined>;
     readonly prefixTemplate: Signal<ArdSelectPrefixTemplateDirective | undefined>;
     readonly suffixTemplate: Signal<ArdSelectSuffixTemplateDirective | undefined>;
-    getValueContext(item: ArdOption): ValueContext;
+    readonly optionContextGenerator: Signal<(item: ArdOption) => OptionContext<ArdOption>>;
+    readonly valueContextGenerator: Signal<(item: ArdOption) => ValueContext>;
+    readonly groupContextGenerator: Signal<(group: ArdOptionGroup) => GroupContext>;
     readonly getStatsContext: Signal<StatsContext>;
     readonly getSearchContext: Signal<SearchContext>;
     readonly getPlaceholderContext: Signal<PlaceholderContext>;
     readonly getCustomOptionContext: Signal<CustomOptionContext>;
-    getGroupContext(group: ArdOptionGroup): GroupContext;
-    getOptionContext(item: ArdOption): OptionContext<ArdOption>;
     readonly getItemLimitContext: Signal<ItemLimitContext>;
     readonly getItemDisplayLimitContext: Signal<ItemDisplayLimitContext>;
     private readonly elementRef;
@@ -131,8 +136,8 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     private readonly overlay;
     private readonly viewContainerRef;
     private readonly scrollStrategyOpts;
-    dropdownHost: ElementRef<HTMLDivElement>;
-    dropdownTemplate: TemplateRef<any>;
+    readonly dropdownHost: Signal<ElementRef<HTMLDivElement>>;
+    readonly dropdownTemplate: Signal<TemplateRef<any>>;
     readonly dropdownPanelWidth: import("@angular/core").InputSignalWithTransform<Nullable<string | number>, Nullable<string | number>>;
     readonly dropdownPanelHeight: import("@angular/core").InputSignalWithTransform<Nullable<string | number>, Nullable<string | number>>;
     readonly dropdownPanelMinWidth: import("@angular/core").InputSignalWithTransform<Nullable<string | number>, Nullable<string | number>>;
@@ -162,9 +167,9 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     readonly isInputElementReadonly: Signal<boolean>;
     isValueWithinDisplayLimit(i: number): boolean;
     readonly placeholderForCurrentContext: Signal<string>;
-    filter(filterTerm: string, suppressSearchEvent?: boolean): void;
+    filter(filterTerm: string, shouldAutoOpen: boolean): void;
     onSearchInputFocus(): void;
-    onSearchInputBlur(): void;
+    onBlur(event: FocusEvent): void;
     toggleItem(item: ArdOption): void;
     selectItem(...items: ArdOption[]): void;
     unselectItem(...items: ArdOption[]): void;
@@ -195,10 +200,11 @@ export declare class ArdiumSelectComponent extends _FormFieldComponentBase imple
     private _onSpacePress;
     private _onArrowDownPress;
     private _onArrowUpPress;
+    private _onEscapePress;
     private _onHomePress;
     private _onEndPress;
     private _onBackspaceOrDeletePress;
     private _onCtrlAPress;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumSelectComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumSelectComponent, "ard-select", never, { "valueFrom": { "alias": "valueFrom"; "required": false; "isSignal": true; }; "labelFrom": { "alias": "labelFrom"; "required": false; "isSignal": true; }; "disabledFrom": { "alias": "disabledFrom"; "required": false; "isSignal": true; }; "groupLabelFrom": { "alias": "groupLabelFrom"; "required": false; "isSignal": true; }; "groupDisabledFrom": { "alias": "groupDisabledFrom"; "required": false; "isSignal": true; }; "childrenFrom": { "alias": "childrenFrom"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "clearButtonTitle": { "alias": "clearButtonTitle"; "required": false; "isSignal": true; }; "dropdownPosition": { "alias": "dropdownPosition"; "required": false; "isSignal": true; }; "noItemsFoundText": { "alias": "noItemsFoundText"; "required": false; "isSignal": true; }; "loadingPlaceholderText": { "alias": "loadingPlaceholderText"; "required": false; "isSignal": true; }; "searchInputId": { "alias": "searchInputId"; "required": false; "isSignal": true; }; "inputAttrs": { "alias": "inputAttrs"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "itemsAlreadyGrouped": { "alias": "itemsAlreadyGrouped"; "required": false; "isSignal": true; }; "invertDisabled": { "alias": "invertDisabled"; "required": false; "isSignal": true; }; "noGroupActions": { "alias": "noGroupActions"; "required": false; "isSignal": true; }; "autoHighlightFirst": { "alias": "autoHighlightFirst"; "required": false; "isSignal": true; }; "autoFocus": { "alias": "autoFocus"; "required": false; "isSignal": true; }; "keepOpen": { "alias": "keepOpen"; "required": false; "isSignal": true; }; "hideSelected": { "alias": "hideSelected"; "required": false; "isSignal": true; }; "noBackspaceClear": { "alias": "noBackspaceClear"; "required": false; "isSignal": true; }; "sortMultipleValues": { "alias": "sortMultipleValues"; "required": false; "isSignal": true; }; "searchCaseSensitive": { "alias": "searchCaseSensitive"; "required": false; "isSignal": true; }; "keepSearchAfterSelect": { "alias": "keepSearchAfterSelect"; "required": false; "isSignal": true; }; "maxSelectedItems": { "alias": "maxSelectedItems"; "required": false; "isSignal": true; }; "itemDisplayLimit": { "alias": "itemDisplayLimit"; "required": false; "isSignal": true; }; "searchFn": { "alias": "searchFn"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "dropdownAppearance": { "alias": "dropdownAppearance"; "required": false; "isSignal": true; }; "dropdownVariant": { "alias": "dropdownVariant"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; }; "multiselectable": { "alias": "multiselectable"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "addCustom": { "alias": "addCustom"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; "isOpen": { "alias": "isOpen"; "required": false; "isSignal": true; }; "dropdownPanelWidth": { "alias": "dropdownPanelWidth"; "required": false; "isSignal": true; }; "dropdownPanelHeight": { "alias": "dropdownPanelHeight"; "required": false; "isSignal": true; }; "dropdownPanelMinWidth": { "alias": "dropdownPanelMinWidth"; "required": false; "isSignal": true; }; "dropdownPanelMinHeight": { "alias": "dropdownPanelMinHeight"; "required": false; "isSignal": true; }; "dropdownPanelMaxWidth": { "alias": "dropdownPanelMaxWidth"; "required": false; "isSignal": true; }; "dropdownPanelMaxHeight": { "alias": "dropdownPanelMaxHeight"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; "changeEvent": "change"; "addEvent": "add"; "failedToAddEvent": "failedToAdd"; "removeEvent": "remove"; "clearEvent": "clear"; "openEvent": "open"; "closeEvent": "close"; "scrollEvent": "scroll"; "scrollToEndEvent": "scrollToEnd"; "searchEvent": "search"; "isOpen": "isOpenChange"; }, ["optionTemplate", "optgroupTemplate", "valueTemplate", "placeholderTemplate", "loadingSpinnerTemplate", "loadingPlaceholderTemplate", "dropdownHeaderTemplate", "dropdownFooterTemplate", "noItemsFoundTemplate", "addCustomTemplate", "itemLimitReachedTemplate", "itemDisplayLimitTemplate", "prefixTemplate", "suffixTemplate", "optionComponents"], never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumSelectComponent, "ard-select", never, { "searchTerm": { "alias": "searchTerm"; "required": false; "isSignal": true; }; "valueFrom": { "alias": "valueFrom"; "required": false; "isSignal": true; }; "labelFrom": { "alias": "labelFrom"; "required": false; "isSignal": true; }; "disabledFrom": { "alias": "disabledFrom"; "required": false; "isSignal": true; }; "groupLabelFrom": { "alias": "groupLabelFrom"; "required": false; "isSignal": true; }; "groupDisabledFrom": { "alias": "groupDisabledFrom"; "required": false; "isSignal": true; }; "childrenFrom": { "alias": "childrenFrom"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "clearButtonTitle": { "alias": "clearButtonTitle"; "required": false; "isSignal": true; }; "dropdownPosition": { "alias": "dropdownPosition"; "required": false; "isSignal": true; }; "noItemsFoundText": { "alias": "noItemsFoundText"; "required": false; "isSignal": true; }; "addCustomOptionText": { "alias": "addCustomOptionText"; "required": false; "isSignal": true; }; "loadingPlaceholderText": { "alias": "loadingPlaceholderText"; "required": false; "isSignal": true; }; "searchInputId": { "alias": "searchInputId"; "required": false; "isSignal": true; }; "inputAttrs": { "alias": "inputAttrs"; "required": false; "isSignal": true; }; "isLoading": { "alias": "isLoading"; "required": false; "isSignal": true; }; "_deferValueWrites": { "alias": "deferValueWrites"; "required": false; "isSignal": true; }; "itemsAlreadyGrouped": { "alias": "itemsAlreadyGrouped"; "required": false; "isSignal": true; }; "invertDisabled": { "alias": "invertDisabled"; "required": false; "isSignal": true; }; "noGroupActions": { "alias": "noGroupActions"; "required": false; "isSignal": true; }; "autoHighlightFirst": { "alias": "autoHighlightFirst"; "required": false; "isSignal": true; }; "autoFocus": { "alias": "autoFocus"; "required": false; "isSignal": true; }; "keepOpen": { "alias": "keepOpen"; "required": false; "isSignal": true; }; "hideSelected": { "alias": "hideSelected"; "required": false; "isSignal": true; }; "noBackspaceClear": { "alias": "noBackspaceClear"; "required": false; "isSignal": true; }; "searchCaseSensitive": { "alias": "searchCaseSensitive"; "required": false; "isSignal": true; }; "keepSearchAfterSelect": { "alias": "keepSearchAfterSelect"; "required": false; "isSignal": true; }; "maxSelectedItems": { "alias": "maxSelectedItems"; "required": false; "isSignal": true; }; "itemDisplayLimit": { "alias": "itemDisplayLimit"; "required": false; "isSignal": true; }; "searchFn": { "alias": "searchFn"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "dropdownAppearance": { "alias": "dropdownAppearance"; "required": false; "isSignal": true; }; "dropdownVariant": { "alias": "dropdownVariant"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; }; "multiselectable": { "alias": "multiselectable"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "searchable": { "alias": "searchable"; "required": false; "isSignal": true; }; "addCustom": { "alias": "addCustom"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; "isOpen": { "alias": "isOpen"; "required": false; "isSignal": true; }; "dropdownPanelWidth": { "alias": "dropdownPanelWidth"; "required": false; "isSignal": true; }; "dropdownPanelHeight": { "alias": "dropdownPanelHeight"; "required": false; "isSignal": true; }; "dropdownPanelMinWidth": { "alias": "dropdownPanelMinWidth"; "required": false; "isSignal": true; }; "dropdownPanelMinHeight": { "alias": "dropdownPanelMinHeight"; "required": false; "isSignal": true; }; "dropdownPanelMaxWidth": { "alias": "dropdownPanelMaxWidth"; "required": false; "isSignal": true; }; "dropdownPanelMaxHeight": { "alias": "dropdownPanelMaxHeight"; "required": false; "isSignal": true; }; }, { "searchTerm": "searchTermChange"; "valueChange": "valueChange"; "addEvent": "add"; "failedToAddEvent": "failedToAdd"; "removeEvent": "remove"; "clearEvent": "clear"; "openEvent": "open"; "closeEvent": "close"; "scrollEvent": "scroll"; "scrollToEndEvent": "scrollToEnd"; "isOpen": "isOpenChange"; }, ["optionTemplate", "optgroupTemplate", "valueTemplate", "placeholderTemplate", "dropdownArrowTemplate", "loadingSpinnerTemplate", "loadingPlaceholderTemplate", "dropdownHeaderTemplate", "dropdownFooterTemplate", "noItemsFoundTemplate", "addCustomTemplate", "itemLimitReachedTemplate", "itemDisplayLimitTemplate", "prefixTemplate", "suffixTemplate", "optionComponents"], never, false, never>;
 }

package/lib/select/select.defaults.d.ts

@@ -1,7 +1,7 @@
 import { InjectionToken, Provider } from '@angular/core';
 import { _FormFieldComponentDefaults } from '../_internal/form-field-component';
 import { DropdownPanelAppearance, DropdownPanelVariant } from '../dropdown-panel';
-import { ArdPanelPosition, GroupByFn, SearchFn } from '../types/item-storage.types';
+import { ArdPanelPosition, CompareWithFn, GroupByFn, SearchFn } from '../types/item-storage.types';
 import { Nullable } from '../types/utility.types';
 import { FormElementAppearance, FormElementVariant } from './../types/theming.types';
 import { AddCustomFn } from './select.types';
@@ -17,9 +17,11 @@ export interface ArdSelectDefaults extends _FormFieldComponentDefaults {
     clearButtonTitle: string;
     dropdownPosition: ArdPanelPosition;
     noItemsFoundText: string;
+    addCustomOptionText: string;
     loadingPlaceholderText: string;
     inputAttrs: Record<string, any>;
     isLoading: boolean;
+    deferValueWrites: boolean | null;
     itemsAlreadyGrouped: boolean;
     invertDisabled: boolean;
     noGroupActions: boolean;
@@ -34,7 +36,7 @@ export interface ArdSelectDefaults extends _FormFieldComponentDefaults {
     maxSelectedItems: number;
     itemDisplayLimit: number;
     searchFn: SearchFn;
-    compareWith: Nullable<SearchFn>;
+    compareWith: Nullable<CompareWithFn>;
     appearance: FormElementAppearance;
     variant: FormElementVariant;
     compact: boolean;

package/lib/select/select.directive.d.ts

@@ -44,6 +44,12 @@ export declare class ArdSelectPlaceholderTemplateDirective {
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdSelectPlaceholderTemplateDirective, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<ArdSelectPlaceholderTemplateDirective, "ard-select > ng-template[ard-placeholder-tmp]", never, {}, {}, never, never, false, never>;
 }
+export declare class ArdSelectDropdownArrowTemplateDirective {
+    template: TemplateRef<null>;
+    constructor(template: TemplateRef<null>);
+    static ɵfac: i0.ɵɵFactoryDeclaration<ArdSelectDropdownArrowTemplateDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<ArdSelectDropdownArrowTemplateDirective, "ard-select > ng-template[ard-dropdown-arrow-tmp]", never, {}, {}, never, never, false, never>;
+}
 export declare class ArdLoadingSpinnerTemplateDirective {
     template: TemplateRef<null>;
     constructor(template: TemplateRef<null>);

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

@@ -9,6 +9,6 @@ import * as i7 from "@ardium-ui/devkit";
 import * as i8 from "../_internal/clear-button/clear-button.module";
 export declare class ArdiumSelectModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumSelectModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<ArdiumSelectModule, [typeof i1.ArdiumSelectComponent, typeof i2.ArdOptionTemplateDirective, typeof i2.ArdOptgroupTemplateDirective, typeof i2.ArdValueTemplateDirective, typeof i2.ArdSelectPlaceholderTemplateDirective, typeof i2.ArdLoadingSpinnerTemplateDirective, typeof i2.ArdLoadingPlaceholderTemplateDirective, typeof i2.ArdDropdownHeaderTemplateDirective, typeof i2.ArdDropdownFooterTemplateDirective, typeof i2.ArdNoItemsFoundTemplateDirective, typeof i2.ArdValueChipTemplateDirective, typeof i2.ArdItemLimitReachedTemplateDirective, typeof i2.ArdItemDisplayLimitTemplateDirective, typeof i2.ArdAddCustomTemplateDirective, typeof i2.ArdSelectPrefixTemplateDirective, typeof i2.ArdSelectSuffixTemplateDirective], [typeof i3.CommonModule, typeof i4.ArdiumFormFieldFrameModule, typeof i5.ArdiumDropdownPanelModule, typeof i6.ArdiumChipModule, typeof i7.ArdiumClickOutsideModule, typeof i8._ClearButtonModule, typeof i7.ArdiumEscapeHTMLModule], [typeof i1.ArdiumSelectComponent, typeof i2.ArdOptionTemplateDirective, typeof i2.ArdOptgroupTemplateDirective, typeof i2.ArdValueTemplateDirective, typeof i2.ArdSelectPlaceholderTemplateDirective, typeof i2.ArdLoadingSpinnerTemplateDirective, typeof i2.ArdLoadingPlaceholderTemplateDirective, typeof i2.ArdDropdownHeaderTemplateDirective, typeof i2.ArdDropdownFooterTemplateDirective, typeof i2.ArdNoItemsFoundTemplateDirective, typeof i2.ArdValueChipTemplateDirective, typeof i2.ArdItemLimitReachedTemplateDirective, typeof i2.ArdItemDisplayLimitTemplateDirective, typeof i2.ArdAddCustomTemplateDirective, typeof i2.ArdSelectPrefixTemplateDirective, typeof i2.ArdSelectSuffixTemplateDirective]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<ArdiumSelectModule, [typeof i1.ArdiumSelectComponent, typeof i2.ArdOptionTemplateDirective, typeof i2.ArdOptgroupTemplateDirective, typeof i2.ArdValueTemplateDirective, typeof i2.ArdSelectPlaceholderTemplateDirective, typeof i2.ArdLoadingSpinnerTemplateDirective, typeof i2.ArdLoadingPlaceholderTemplateDirective, typeof i2.ArdDropdownHeaderTemplateDirective, typeof i2.ArdDropdownFooterTemplateDirective, typeof i2.ArdNoItemsFoundTemplateDirective, typeof i2.ArdValueChipTemplateDirective, typeof i2.ArdItemLimitReachedTemplateDirective, typeof i2.ArdItemDisplayLimitTemplateDirective, typeof i2.ArdAddCustomTemplateDirective, typeof i2.ArdSelectPrefixTemplateDirective, typeof i2.ArdSelectSuffixTemplateDirective, typeof i2.ArdSelectDropdownArrowTemplateDirective], [typeof i3.CommonModule, typeof i4.ArdiumFormFieldFrameModule, typeof i5.ArdiumDropdownPanelModule, typeof i6.ArdiumChipModule, typeof i7.ArdiumClickOutsideModule, typeof i8._ClearButtonModule, typeof i7.ArdiumEscapeHTMLModule], [typeof i1.ArdiumSelectComponent, typeof i2.ArdOptionTemplateDirective, typeof i2.ArdOptgroupTemplateDirective, typeof i2.ArdValueTemplateDirective, typeof i2.ArdSelectPlaceholderTemplateDirective, typeof i2.ArdLoadingSpinnerTemplateDirective, typeof i2.ArdLoadingPlaceholderTemplateDirective, typeof i2.ArdDropdownHeaderTemplateDirective, typeof i2.ArdDropdownFooterTemplateDirective, typeof i2.ArdNoItemsFoundTemplateDirective, typeof i2.ArdValueChipTemplateDirective, typeof i2.ArdItemLimitReachedTemplateDirective, typeof i2.ArdItemDisplayLimitTemplateDirective, typeof i2.ArdAddCustomTemplateDirective, typeof i2.ArdSelectPrefixTemplateDirective, typeof i2.ArdSelectSuffixTemplateDirective, typeof i2.ArdSelectDropdownArrowTemplateDirective]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<ArdiumSelectModule>;
 }

package/lib/select/select.types.d.ts

@@ -2,6 +2,8 @@ import { ArdOption, ArdOptionGroup, OptionContext } from '../types/item-storage.
 export type AddCustomFn<T> = (value: string) => T;
 export interface ValueContext extends OptionContext<ArdOption> {
     unselect: () => void;
+    itemsSelectedCount: number;
+    totalItemsCount: number;
 }
 export interface PlaceholderContext {
     placeholder: string;
@@ -22,8 +24,10 @@ export interface CustomOptionContext {
 export interface GroupContext {
     $implicit: ArdOptionGroup;
     group: ArdOptionGroup;
-    selectedChildren: number;
-    totalChildren: number;
+    label: string;
+    disabled: boolean;
+    selectedChildrenCount: number;
+    totalChildrenCount: number;
 }
 export interface ItemLimitContext {
     totalItems: number;

package/lib/slide-toggle/slide-toggle.component.d.ts

@@ -7,6 +7,8 @@ import * as i0 from "@angular/core";
 export declare class ArdiumSlideToggleComponent extends _BooleanComponentBase {
     protected readonly _DEFAULTS: ArdSlideToggleDefaults;
     constructor(defaults: ArdSlideToggleDefaults);
+    protected readonly _componentId = "101";
+    protected readonly _componentName = "slide-toggle";
     readonly wrapperClass: import("@angular/core").InputSignal<Nullable<string>>;
     readonly color: import("@angular/core").InputSignal<ComponentColor>;
     readonly appearance: import("@angular/core").InputSignal<ArdSlideToggleAppearance>;

package/lib/slider/abstract-slider.d.ts

@@ -1,16 +1,16 @@
 import { Overlay, ScrollStrategyOptions } from '@angular/cdk/overlay';
-import { ElementRef, Renderer2, ViewContainerRef } from '@angular/core';
+import { ElementRef, Renderer2, Signal, ViewContainerRef, WritableSignal } from '@angular/core';
 import { BooleanLike, NumberLike } from '@ardium-ui/devkit';
 import { _NgModelComponentBase, _NgModelComponentDefaults } from '../_internal/ngmodel-component';
 import { SimpleComponentColor } from '../types/colors.types';
-import { Nullable } from '../types/utility.types';
+import { ArdRangeSelectionBehavior } from './range-slider/range-slider.types';
 import { ArdSliderTooltipDirective } from './slider.directive';
 import { SliderDecorationPosition, SliderLabelObject, SliderTooltipBehavior, SliderTooltipFormatFn, _InternalSliderLabelObject } from './slider.types';
 import * as i0 from "@angular/core";
 export interface _AsbtractSliderDefaults extends _NgModelComponentDefaults {
     noTooltip: boolean;
     showValueTicks: boolean;
-    formatTooltipFn: Nullable<SliderTooltipFormatFn>;
+    formatTooltipFn: SliderTooltipFormatFn;
     min: number;
     max: number;
     step: number;
@@ -21,60 +21,69 @@ export interface _AsbtractSliderDefaults extends _NgModelComponentDefaults {
     compact: boolean;
     tooltipPosition: SliderDecorationPosition;
     tooltipBehavior: SliderTooltipBehavior;
+    selectionBehavior: ArdRangeSelectionBehavior;
+    minimumDistance: number;
+    emitTouchedOnEveryChange: boolean;
 }
 export declare const _asbtractSliderDefaults: _AsbtractSliderDefaults;
 export declare abstract class _AbstractSlider<T> extends _NgModelComponentBase {
     abstract readonly componentId: string;
     abstract readonly componentName: string;
     protected readonly _DEFAULTS: _AsbtractSliderDefaults;
-    readonly elementRef: import("@angular/core").Signal<ElementRef<HTMLElement> | undefined>;
+    readonly elementRef: Signal<ElementRef<HTMLElement> | undefined>;
     protected readonly document: Document;
     protected readonly renderer: Renderer2;
     protected readonly overlay: Overlay;
     protected readonly scrollStrategyOpts: ScrollStrategyOptions;
     protected readonly viewContainerRef: ViewContainerRef;
-    readonly noTooltip: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
-    readonly tooltipFormatFn: import("@angular/core").InputSignal<Nullable<SliderTooltipFormatFn>>;
-    protected abstract _updateTooltipValue(): void;
     readonly min: import("@angular/core").InputSignalWithTransform<number, NumberLike>;
     readonly max: import("@angular/core").InputSignalWithTransform<number, NumberLike>;
     readonly step: import("@angular/core").InputSignalWithTransform<number, NumberLike>;
+    readonly minMaxStepValueCleanup: import("@angular/core").EffectRef;
+    readonly minMaxErrorCheck: import("@angular/core").EffectRef;
     readonly shiftMultiplier: import("@angular/core").InputSignalWithTransform<number, NumberLike>;
-    protected readonly _stepSizeComputed: import("@angular/core").Signal<number>;
+    protected readonly _stepSizeComputed: Signal<number>;
     readonly showValueTicks: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
-    readonly percentStepSize: import("@angular/core").Signal<number>;
-    protected readonly _tickArray: import("@angular/core").Signal<string[]>;
+    protected readonly _tickArray: Signal<string[]>;
+    private _transformLabelInput;
     readonly labelPosition: import("@angular/core").InputSignal<SliderDecorationPosition>;
-    readonly labels: import("@angular/core").InputSignal<number[] | SliderLabelObject[] | null>;
-    readonly labelObjects: import("@angular/core").Signal<_InternalSliderLabelObject[]>;
+    readonly labels: import("@angular/core").InputSignalWithTransform<SliderLabelObject[], string | number[] | SliderLabelObject[] | null | undefined>;
+    readonly labelObjects: Signal<_InternalSliderLabelObject[]>;
     readonly color: import("@angular/core").InputSignal<SimpleComponentColor>;
     readonly compact: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
-    readonly ngClasses: import("@angular/core").Signal<string>;
-    readonly sliderTransition: import("@angular/core").Signal<string>;
+    readonly ngClasses: Signal<string>;
+    readonly sliderTransition: Signal<string>;
     private readonly _totalSteps;
-    protected abstract _value: T;
+    protected abstract readonly _value: WritableSignal<T>;
     set value(newValue: T);
     get value(): T;
     readonly valueChange: import("@angular/core").OutputEmitterRef<T>;
     abstract writeValue(v: any): void;
+    abstract cleanupValueAfterMinMaxStepChange(): void;
     abstract reset(): void;
     protected _offset(offset: number, hasShift: boolean, handleId?: number): void;
+    protected _decrement(event: KeyboardEvent, forceShift?: boolean): void;
+    protected _increment(event: KeyboardEvent, forceShift?: boolean): void;
     protected _clampValue(v: number): number;
     protected _valueToPercent(v: number): number;
     protected _emitChange(): void;
-    readonly tooltipTemplate: import("@angular/core").Signal<ArdSliderTooltipDirective | undefined>;
+    readonly noTooltip: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
+    readonly tooltipFormatFn: import("@angular/core").InputSignal<SliderTooltipFormatFn>;
+    readonly tooltipTemplate: Signal<ArdSliderTooltipDirective | undefined>;
     readonly tooltipPosition: import("@angular/core").InputSignal<SliderDecorationPosition>;
     readonly tooltipBehavior: import("@angular/core").InputSignal<SliderTooltipBehavior>;
-    protected readonly _grabbedHandleId: import("@angular/core").WritableSignal<number | null>;
+    protected readonly _grabbedHandleId: WritableSignal<number | null>;
     protected _shouldCheckForMovement: boolean;
     protected _bodyHasClass: boolean;
-    readonly isSliderHandleGrabbed: import("@angular/core").Signal<boolean>;
+    readonly emitTouchedOnEveryChange: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
+    readonly isSliderHandleGrabbed: Signal<boolean>;
+    readonly grabbedHandleEffect: import("@angular/core").EffectRef;
     abstract onTrackHitboxPointerDown(event: MouseEvent | TouchEvent): void;
     onPointerDownOnHandle(event: MouseEvent | TouchEvent, handleId?: number): void;
     abstract onPointerMove(event: MouseEvent | TouchEvent): void;
     onPointerUp(): void;
-    protected _positionPercent: [number] | [number, number];
-    getHandlePosition(handleId?: number): string;
+    protected abstract readonly _handlePositions: Signal<[number, number]>;
+    readonly handlePositionsPercent: Signal<[string, string]>;
     protected _setValueFromPercent(percent: number, handleId?: number | null): void;
     protected _writeValueFromEvent(event: MouseEvent | TouchEvent, handleId?: number | null): void;
     protected abstract _percentValueToValue(percent: number, handleId?: number): T;
@@ -82,8 +91,6 @@ export declare abstract class _AbstractSlider<T> extends _NgModelComponentBase {
     protected _clampPercentValue(percent: number): number;
     protected _getPercentValueFromEvent(event: MouseEvent | TouchEvent): number;
     onKeyPress(event: KeyboardEvent): void;
-    protected _decrement(event: KeyboardEvent, steps?: number): void;
-    protected _increment(event: KeyboardEvent, steps?: number): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<_AbstractSlider<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<_AbstractSlider<any>, never, never, { "noTooltip": { "alias": "noTooltip"; "required": false; "isSignal": true; }; "tooltipFormatFn": { "alias": "tooltipFormatFn"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "shiftMultiplier": { "alias": "shiftMultiplier"; "required": false; "isSignal": true; }; "showValueTicks": { "alias": "showValueTicks"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; "isSignal": true; }; "tooltipBehavior": { "alias": "tooltipBehavior"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, ["tooltipTemplate"], never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<_AbstractSlider<any>, never, never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "shiftMultiplier": { "alias": "shiftMultiplier"; "required": false; "isSignal": true; }; "showValueTicks": { "alias": "showValueTicks"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; "labels": { "alias": "labels"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; }; "noTooltip": { "alias": "noTooltip"; "required": false; "isSignal": true; }; "tooltipFormatFn": { "alias": "tooltipFormatFn"; "required": false; "isSignal": true; }; "tooltipPosition": { "alias": "tooltipPosition"; "required": false; "isSignal": true; }; "tooltipBehavior": { "alias": "tooltipBehavior"; "required": false; "isSignal": true; }; "emitTouchedOnEveryChange": { "alias": "emitTouchedOnEveryChange"; "required": false; "isSignal": true; }; }, { "valueChange": "valueChange"; }, ["tooltipTemplate"], never, true, never>;
 }

package/lib/slider/index.d.ts

@@ -1,5 +1,6 @@
 export * from './range-slider/range-slider.component';
 export * from './range-slider/range-slider.module';
+export * from './range-slider/range-slider.types';
 export * from './slider.component';
 export * from './slider.defaults';
 export * from './slider.directive';

package/lib/slider/range-slider/range-slider.component.d.ts

@@ -1,34 +1,37 @@
 import { OnInit } from '@angular/core';
+import { NumberLike } from '@ardium-ui/devkit';
 import { _AbstractSlider } from '../abstract-slider';
 import { ArdSliderDefaults } from '../slider.defaults';
 import { SliderRange, SliderTooltipContext } from '../slider.types';
+import { ArdRangeSelectionBehavior } from './range-slider.types';
 import * as i0 from "@angular/core";
 export declare class ArdiumRangeSliderComponent extends _AbstractSlider<SliderRange> implements OnInit {
     readonly componentId = "106";
     readonly componentName = "range-slider";
     protected readonly _DEFAULTS: ArdSliderDefaults;
     constructor(defaults: ArdSliderDefaults);
-    protected _value: SliderRange;
-    ngOnInit(): void;
+    protected readonly _value: import("@angular/core").WritableSignal<SliderRange<number>>;
     private _isValidObject;
     private _isValidTuple;
-    private _arrayValueToObjectValue;
     private _normalizeSliderRange;
     writeValue(v: any): void;
     get value(): SliderRange;
     set value(v: any);
-    _tooltipValue: SliderRange<string | number>;
-    protected _updateTooltipValue(): void;
-    getTooltipContext(type: 'low' | 'high'): SliderTooltipContext;
+    cleanupValueAfterMinMaxStepChange(): void;
+    readonly selectionBehavior: import("@angular/core").InputSignal<ArdRangeSelectionBehavior>;
+    readonly minimumDistance: import("@angular/core").InputSignalWithTransform<number, NumberLike>;
+    protected readonly _tooltipValue: import("@angular/core").Signal<SliderRange<string>>;
+    readonly tooltipContexts: import("@angular/core").Signal<SliderRange<SliderTooltipContext>>;
     reset(): void;
-    get trackOverlayLeft(): string;
-    get trackOverlayWidth(): string;
+    readonly trackOverlayLeft: import("@angular/core").Signal<string>;
+    readonly trackOverlayWidth: import("@angular/core").Signal<string>;
     onTrackHitboxPointerDown(event: MouseEvent | TouchEvent): void;
     onPointerMove(event: MouseEvent | TouchEvent): void;
     protected _percentValueToValue(percent: number, handleId: number): SliderRange;
-    readonly currentHandle: import("@angular/core").WritableSignal<1 | 2 | null>;
+    protected readonly _handlePositions: import("@angular/core").Signal<[number, number]>;
+    readonly currentHandle: import("@angular/core").WritableSignal<2 | 1 | null>;
     onHandleFocus(event: FocusEvent, handleId: 1 | 2): void;
     onBlur(event: FocusEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumRangeSliderComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRangeSliderComponent, "ard-range-slider", never, {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArdiumRangeSliderComponent, "ard-range-slider", never, { "selectionBehavior": { "alias": "selectionBehavior"; "required": false; "isSignal": true; }; "minimumDistance": { "alias": "minimumDistance"; "required": false; "isSignal": true; }; }, {}, never, never, false, never>;
 }