@koobiq/components 18.35.0 → 18.36.0

package/time-range/time-range-editor.d.ts

@@ -0,0 +1,67 @@
+import { OnInit } from '@angular/core';
+import { AbstractControl, ControlValueAccessor, FormControl, FormGroup, FormGroupDirective, NgForm, ValidationErrors, Validator } from '@angular/forms';
+import { ErrorStateMatcher, KbqTimeRangeLocaleConfig } from '@koobiq/components/core';
+import { KbqTimepicker, TimeFormats } from '@koobiq/components/timepicker';
+import { KbqRangeValue, KbqTimeRangeRange, KbqTimeRangeType } from './types';
+import * as i0 from "@angular/core";
+interface FormValue<T> {
+    type: FormControl<KbqTimeRangeType>;
+    fromTime: FormControl<T>;
+    fromDate: FormControl<T>;
+    toTime: FormControl<T>;
+    toDate: FormControl<T>;
+}
+declare class RangeErrorStateMatcher implements ErrorStateMatcher {
+    isErrorState(control: AbstractControl | null, form: FormGroupDirective | NgForm | null): boolean;
+}
+/** @docs-private */
+export declare class KbqTimeRangeEditor<T> implements ControlValueAccessor, Validator, OnInit {
+    private readonly timeRangeService;
+    /** The maximum selectable date. */
+    readonly maxDate: import("@angular/core").InputSignal<T | null>;
+    /** The minimum selectable date. */
+    readonly minDate: import("@angular/core").InputSignal<T | null>;
+    /** Preset of selectable ranges */
+    readonly availableTimeRangeTypes: import("@angular/core").InputSignal<KbqTimeRangeType[]>;
+    /** Provided value of selected range */
+    readonly rangeValue: import("@angular/core").InputSignal<Required<KbqRangeValue<T>>>;
+    readonly showRangeAsDefault: import("@angular/core").InputSignal<boolean>;
+    readonly localeConfiguration: import("@angular/core").InputSignal<KbqTimeRangeLocaleConfig>;
+    /** @docs-private */
+    protected readonly isRangeVisible: import("@angular/core").Signal<boolean>;
+    /** @docs-private */
+    protected readonly timeRangeTypesWithoutRange: import("@angular/core").Signal<{
+        type: "lastMinute" | "last5Minutes" | "last15Minutes" | "last30Minutes" | "lastHour" | "last24Hours" | "last3Days" | "last7Days" | "last14Days" | "last30Days" | "last3Months" | "last12Months" | "allTime" | "currentQuarter" | "currentYear";
+        translationType: import("./types").KbqTimeRangeTranslationType;
+        formattedValue: string;
+    }[]>;
+    /** @docs-private */
+    protected readonly timepickerList: import("@angular/core").Signal<readonly KbqTimepicker<T>[]>;
+    /** @docs-private */
+    protected readonly form: FormGroup<FormValue<T>>;
+    /** @docs-private */
+    protected readonly timepickerFormat = TimeFormats.HHmmss;
+    /** @docs-private */
+    protected readonly rangeStateMatcher: RangeErrorStateMatcher;
+    private lastValidationErrorOnEmit;
+    constructor();
+    ngOnInit(): void;
+    /** @docs-private */
+    validate(): ValidationErrors | null;
+    /** Implemented as part of ControlValueAccessor */
+    writeValue(value: KbqTimeRangeRange | undefined): void;
+    /** @docs-private */
+    onChange: (_value: KbqTimeRangeRange) => void;
+    /** @docs-private */
+    onTouch: () => void;
+    /** Implemented as part of ControlValueAccessor */
+    registerOnChange(fn: (value: KbqTimeRangeRange) => void): void;
+    /** Implemented as part of ControlValueAccessor */
+    registerOnTouched(fn: () => void): void;
+    private mapTimeRange;
+    private getFormattedOption;
+    private concatControlValidationErrors;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimeRangeEditor<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTimeRangeEditor<any>, "kbq-time-range-editor", never, { "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "availableTimeRangeTypes": { "alias": "availableTimeRangeTypes"; "required": false; "isSignal": true; }; "rangeValue": { "alias": "rangeValue"; "required": false; "isSignal": true; }; "showRangeAsDefault": { "alias": "showRangeAsDefault"; "required": true; "isSignal": true; }; "localeConfiguration": { "alias": "localeConfiguration"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+export {};

package/time-range/time-range-title-as-form-field.d.ts

@@ -0,0 +1,40 @@
+import { NgControl } from '@angular/forms';
+import { KbqFormFieldControl } from '@koobiq/components/form-field';
+import { Observable } from 'rxjs';
+import * as i0 from "@angular/core";
+/** Directive for easy using styles of time-range placeholder publicly. */
+export declare class KbqTimeRangeTitlePlaceholder {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimeRangeTitlePlaceholder, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqTimeRangeTitlePlaceholder, "[kbqTimeRangeTitlePlaceholder]", never, {}, {}, never, never, true, never>;
+}
+/** Component simulates `KbqFormFieldControl` allowing to provide custom content inside `KbqFormField` */
+export declare class KbqTimeRangeTitleAsControl implements KbqFormFieldControl<any> {
+    private timeRange;
+    controlType: string;
+    /** @docs-private */
+    stateChanges: Observable<void>;
+    /** @docs-private */
+    ngControl: NgControl | null;
+    /** @docs-private */
+    value: any;
+    /** @docs-private */
+    id: string;
+    /** @docs-private */
+    placeholder: string;
+    /** @docs-private */
+    focused: boolean;
+    /** @docs-private */
+    empty: boolean;
+    /** @docs-private */
+    required: boolean;
+    /** @docs-private */
+    disabled: boolean;
+    /** @docs-private */
+    errorState: boolean;
+    /** @docs-private */
+    onContainerClick(_event: MouseEvent): void;
+    /** @docs-private */
+    focus(_options?: FocusOptions): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimeRangeTitleAsControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTimeRangeTitleAsControl, "kbq-time-range-title-as-control", never, {}, {}, never, ["*"], true, never>;
+}

package/time-range/time-range-title.d.ts

@@ -0,0 +1,18 @@
+import { Injector, TemplateRef } from '@angular/core';
+import { KbqTimeRangeLocaleConfig } from '@koobiq/components/core';
+import { KbqTimeRangeCustomizableTitleContext, KbqTimeRangeRange, KbqTimeRangeTitleContext } from './types';
+import * as i0 from "@angular/core";
+/** @docs-private */
+export declare class KbqTimeRangeTitle {
+    private readonly timeRangeService;
+    private readonly popover;
+    protected readonly injector: Injector;
+    readonly timeRange: import("@angular/core").InputSignal<KbqTimeRangeRange | null>;
+    readonly localeConfiguration: import("@angular/core").InputSignal<KbqTimeRangeLocaleConfig>;
+    readonly titleTemplate: import("@angular/core").InputSignal<TemplateRef<any> | undefined>;
+    protected readonly context: import("@angular/core").Signal<KbqTimeRangeTitleContext | undefined>;
+    protected readonly titleContext: import("@angular/core").Signal<KbqTimeRangeCustomizableTitleContext | undefined>;
+    protected readonly formattedDate: import("@angular/core").Signal<string>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimeRangeTitle, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTimeRangeTitle, "kbq-time-range-title", never, { "timeRange": { "alias": "timeRange"; "required": true; "isSignal": true; }; "localeConfiguration": { "alias": "localeConfiguration"; "required": true; "isSignal": true; }; "titleTemplate": { "alias": "titleTemplate"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}

package/time-range/time-range.d.ts

@@ -0,0 +1,75 @@
+import { InjectionToken, OnInit, Provider, TemplateRef, WritableSignal } from '@angular/core';
+import { ControlValueAccessor, FormControl, NgControl } from '@angular/forms';
+import { KbqTimeRangeLocaleConfig, PopUpPlacements, PopUpSizes } from '@koobiq/components/core';
+import { KbqPopoverTrigger } from '@koobiq/components/popover';
+import { KbqRangeValue, KbqTimeRangeCustomizableTitleContext, KbqTimeRangeRange, KbqTimeRangeType } from './types';
+import * as i0 from "@angular/core";
+/** Localization configuration provider. */
+export declare const KBQ_TIME_RANGE_LOCALE_CONFIGURATION: InjectionToken<KbqTimeRangeLocaleConfig>;
+/** Utility provider for `KBQ_TIME_RANGE_LOCALE_CONFIGURATION`. */
+export declare const kbqTimeRangeLocaleConfigurationProvider: (configuration: KbqTimeRangeLocaleConfig) => Provider;
+export declare class KbqTimeRange<T> implements ControlValueAccessor, OnInit {
+    private readonly timeRangeService;
+    private readonly localeService;
+    readonly ngControl: NgControl | null;
+    /** The minimum selectable date. */
+    readonly minDate: import("@angular/core").InputSignal<T | undefined>;
+    /** The maximum selectable date. */
+    readonly maxDate: import("@angular/core").InputSignal<T | undefined>;
+    /** provided value of selected range */
+    readonly defaultRangeValue: import("@angular/core").InputSignal<KbqRangeValue<T> | undefined>;
+    /** Preset of selectable ranges */
+    readonly availableTimeRangeTypes: import("@angular/core").InputSignal<KbqTimeRangeType[]>;
+    /** Customizable trigger output */
+    readonly titleTemplate: import("@angular/core").InputSignal<TemplateRef<KbqTimeRangeCustomizableTitleContext> | undefined>;
+    /** Whether to show popover with arrow */
+    readonly arrow: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Whether to show range in popover if not provided
+     * @see availableTimeRangeTypes
+     */
+    readonly showRangeAsDefault: import("@angular/core").InputSignal<boolean>;
+    /** Whether component should fallback to default value if null provided */
+    readonly nonNullable: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    /** Emit value update if provided value via formControl wasn't valid */
+    readonly valueCorrected: import("@angular/core").OutputEmitterRef<KbqTimeRangeRange>;
+    /**
+     * Used to calculate time range.
+     * @docs-private */
+    protected readonly normalizedDefaultRangeValue: import("@angular/core").Signal<{
+        fromTime: T;
+        fromDate: T;
+        toTime: T;
+        toDate: T;
+    }>;
+    /** @docs-private */
+    protected readonly titleValue: WritableSignal<KbqTimeRangeRange | null>;
+    /** @docs-private */
+    protected readonly rangeEditorControl: FormControl<KbqTimeRangeRange>;
+    /** @docs-private */
+    protected readonly popoverSize = PopUpSizes.Medium;
+    /** @docs-private */
+    protected readonly popupPlacement = PopUpPlacements.BottomLeft;
+    /** @docs-private */
+    protected readonly localeConfiguration: WritableSignal<KbqTimeRangeLocaleConfig>;
+    constructor();
+    ngOnInit(): void;
+    /** Implemented as part of ControlValueAccessor */
+    writeValue(value: KbqTimeRangeRange | null): void;
+    /** @docs-private */
+    onApply(popover: KbqPopoverTrigger): void;
+    /** @docs-private */
+    onCancel(popover: KbqPopoverTrigger): void;
+    onVisibleChange(isVisible: boolean): void;
+    /** @docs-private */
+    onChange: (_value: KbqTimeRangeRange) => void;
+    /** @docs-private */
+    onTouch: () => void;
+    /** Implemented as part of ControlValueAccessor */
+    registerOnChange(fn: (_value: KbqTimeRangeRange) => void): void;
+    /** Implemented as part of ControlValueAccessor */
+    registerOnTouched(fn: () => void): void;
+    private handleAvailableTypesChange;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimeRange<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTimeRange<any>, "kbq-time-range", never, { "minDate": { "alias": "minDate"; "required": false; "isSignal": true; }; "maxDate": { "alias": "maxDate"; "required": false; "isSignal": true; }; "defaultRangeValue": { "alias": "defaultRangeValue"; "required": false; "isSignal": true; }; "availableTimeRangeTypes": { "alias": "availableTimeRangeTypes"; "required": false; "isSignal": true; }; "titleTemplate": { "alias": "titleTemplate"; "required": false; "isSignal": true; }; "arrow": { "alias": "arrow"; "required": false; "isSignal": true; }; "showRangeAsDefault": { "alias": "showRangeAsDefault"; "required": false; "isSignal": true; }; "nonNullable": { "alias": "nonNullable"; "required": false; "isSignal": true; }; }, { "valueCorrected": "valueCorrected"; }, never, never, true, never>;
+}

package/time-range/time-range.scss

@@ -0,0 +1,66 @@
+.kbq-time-range {
+    .kbq-time-range__trigger {
+        display: block;
+    }
+}
+
+.kbq-time-range__popover {
+    .kbq-time-range__buttons {
+        display: flex;
+        flex-direction: row;
+        gap: var(--kbq-size-l);
+    }
+}
+
+.kbq-time-range__editor {
+    display: block;
+
+    .kbq-time-range-editor__container {
+        width: 100%;
+    }
+
+    .kbq-time-range-editor__predefined {
+        column-count: 2;
+
+        .kbq-time-range-editor__predefined-option {
+            display: block;
+            margin-bottom: var(--kbq-size-s);
+        }
+    }
+
+    .kbq-time-range-editor__range {
+        display: flex;
+        flex-direction: column;
+        gap: var(--kbq-size-s);
+
+        .kbq-time-range-editor__predefined {
+            column-count: 2;
+
+            .kbq-time-range-editor__predefined-option {
+                display: block;
+            }
+        }
+
+        .kbq-time-range-editor__date-time {
+            display: flex;
+            flex-direction: row;
+            justify-content: space-between;
+            gap: var(--kbq-size-s);
+
+            .kbq-time-range-editor__date-time-prefix {
+                align-self: center;
+                width: 57px;
+            }
+        }
+    }
+}
+
+.kbq-time-range-title-as-form-field {
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    min-height: calc(var(--kbq-form-field-size-height) - 2 * var(--kbq-size-border-width));
+
+    .kbq-time-range-title__placeholder {
+        color: var(--kbq-foreground-contrast-tertiary);
+    }
+}

package/time-range/time-range.service.d.ts

@@ -0,0 +1,29 @@
+import { DateAdapter, DateFormatter } from '@koobiq/components/core';
+import { KbqRange, KbqRangeValue, KbqTimeRangeRange, KbqTimeRangeTranslateTypeMap, KbqTimeRangeTranslationType, KbqTimeRangeType, KbqTimeRangeUnits } from './types';
+import * as i0 from "@angular/core";
+export declare class KbqTimeRangeService<T> {
+    readonly dateAdapter: DateAdapter<T>;
+    readonly dateFormatter: DateFormatter<T>;
+    protected defaultTimeRangeTypes: KbqTimeRangeType[];
+    readonly providedDefaultTimeRangeTypes: KbqTimeRangeType[];
+    static readonly DEFAULT_RANGE_TYPE: KbqTimeRangeType;
+    static readonly timeRangeMap: Record<KbqTimeRangeType, KbqTimeRangeUnits>;
+    static readonly timeRangeTranslationMap: KbqTimeRangeTranslateTypeMap;
+    constructor();
+    static range: (dateTimeISOString: string) => KbqRange;
+    getTimeRangeTypeUnits(type: KbqTimeRangeType): KbqTimeRangeUnits;
+    getTimeRangeUnitByType(type: KbqTimeRangeType): KbqTimeRangeTranslationType;
+    getDefaultRangeValue(): Required<KbqRangeValue<T>>;
+    getTimeRangeDefaultValue(rangeValue: KbqRangeValue<T>, availableTimeRangeTypes?: KbqTimeRangeType[]): KbqTimeRangeRange;
+    calculateTimeRange(type: KbqTimeRangeType | undefined, rangeValue?: KbqRangeValue<T>): KbqRange;
+    combineDateAndTime(date: T, time: T): T;
+    lastSecondsRange: (seconds: number) => KbqRange;
+    lastMinutesRange: (minutes: number) => KbqRange;
+    lastHoursRange: (hours: number) => KbqRange;
+    lastDaysRange: (days: number) => KbqRange;
+    lastMonthsRange: (months: number) => KbqRange;
+    checkAndCorrectTimeRangeValue(value: KbqTimeRangeRange | null | undefined, availableTimeRangeTypes: KbqTimeRangeType[], rangeValue: KbqRangeValue<T>): KbqTimeRangeRange;
+    omitMilliseconds(date: T): T;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqTimeRangeService<any>, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<KbqTimeRangeService<any>>;
+}

package/time-range/types.d.ts

@@ -0,0 +1,43 @@
+import { KbqPopoverTrigger } from '@koobiq/components/popover';
+import { DurationUnit } from '@koobiq/date-adapter';
+export interface KbqRangeValue<T> {
+    fromTime?: T;
+    fromDate?: T;
+    toTime?: T;
+    toDate?: T;
+}
+export type KbqRange = {
+    startDateTime?: string;
+    endDateTime?: string;
+};
+export type KbqTimeRangeRange = KbqRange & KbqTimeRangeTypeContext;
+export type KbqTimeRangeTypeContext = {
+    type: KbqTimeRangeType;
+};
+/**
+ * Default accepted “time‑range” identifiers.
+ */
+export type KbqTimeRangeType = 'lastMinute' | 'last5Minutes' | 'last15Minutes' | 'last30Minutes' | 'lastHour' | 'last24Hours' | 'last3Days' | 'last7Days' | 'last14Days' | 'last30Days' | 'last3Months' | 'last12Months' | 'allTime' | 'currentQuarter' | 'currentYear' | 'range';
+export type KbqTimeRangeTranslationType = Extract<DurationUnit, 'seconds' | 'minutes' | 'hours' | 'days' | 'weeks' | 'months'> | 'other';
+export interface KbqTimeRangeUnits {
+    seconds?: number;
+    minutes?: number;
+    hours?: number;
+    days?: number;
+    weeks?: number;
+    months?: number;
+}
+export type KbqTimeRangeTitleContext = KbqTimeRangeRange & KbqTimeRangeUnits;
+export type KbqTimeRangeCustomizableTitleContext = Partial<KbqTimeRangeTitleContext> & {
+    $implicit: Partial<KbqTimeRangeTitleContext> & {
+        formattedDate: string;
+        popover: KbqPopoverTrigger;
+    };
+} & {
+    formattedDate: string;
+    popover: KbqPopoverTrigger;
+};
+export type KbqTimeRangeTranslateTypeMap = Record<KbqTimeRangeType, KbqTimeRangeTranslationType>;
+export type KbqTimeRangeOptionContext = KbqTimeRangeTypeContext & KbqTimeRangeUnits & {
+    translationType: KbqTimeRangeTranslationType;
+};

package/timepicker/timepicker.directive.d.ts

@@ -20,7 +20,7 @@ export declare class KbqTimepicker<D> implements KbqFormFieldControl<D>, Control
      * @docs-private
      */
     readonly stateChanges: Subject<void>;
-    readonly errorState: boolean;
+    errorState: boolean;
     /**
      * Implemented as part of KbqFormFieldControl.
      * @docs-private
@@ -90,7 +90,7 @@ export declare class KbqTimepicker<D> implements KbqFormFieldControl<D>, Control
     private onChange;
     private onTouched;
     private localeSubscription;
-    constructor(elementRef: ElementRef, renderer: Renderer2, dateAdapter: DateAdapter<any>, localeService?: KbqLocaleService | undefined);
+    constructor(elementRef: ElementRef<HTMLInputElement>, renderer: Renderer2, dateAdapter: DateAdapter<any>, localeService?: KbqLocaleService | undefined);
     ngOnDestroy(): void;
     getSize(): number;
     focus(): void;

package/toast/toast.component.d.ts

@@ -1,11 +1,12 @@
 import { AnimationEvent } from '@angular/animations';
 import { FocusMonitor } from '@angular/cdk/a11y';
 import { ElementRef, OnDestroy } from '@angular/core';
-import { ThemePalette } from '@koobiq/components/core';
+import { KbqReadStateDirective, ThemePalette } from '@koobiq/components/core';
 import { BehaviorSubject } from 'rxjs';
 import { KbqToastService } from './toast.service';
 import { KbqToastData } from './toast.type';
 import * as i0 from "@angular/core";
+import * as i1 from "@koobiq/components/core";
 export declare class KbqToastCloseButton {
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqToastCloseButton, never>;
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqToastCloseButton, "[kbq-toast-close-button]", never, {}, {}, never, never, true, never>;
@@ -13,8 +14,9 @@ export declare class KbqToastCloseButton {
 export declare class KbqToastComponent implements OnDestroy {
     readonly data: KbqToastData;
     readonly service: KbqToastService;
-    elementRef: ElementRef;
+    elementRef: ElementRef<HTMLElement>;
     private focusMonitor;
+    protected readonly readStateDirective: KbqReadStateDirective;
     themePalette: typeof ThemePalette;
     animationState: string;
     readonly hovered: BehaviorSubject<boolean>;
@@ -27,7 +29,7 @@ export declare class KbqToastComponent implements OnDestroy {
         [x: string]: boolean;
     };
     get isFocusedOrHovered(): boolean;
-    constructor(data: KbqToastData, service: KbqToastService, elementRef: ElementRef, focusMonitor: FocusMonitor);
+    constructor(data: KbqToastData, service: KbqToastService, elementRef: ElementRef<HTMLElement>, focusMonitor: FocusMonitor);
     ngOnDestroy(): void;
     close(): void;
     isTemplateRef(value: any): boolean;
@@ -35,5 +37,5 @@ export declare class KbqToastComponent implements OnDestroy {
     private runFocusMonitor;
     private stopFocusMonitor;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqToastComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KbqToastComponent, "kbq-toast", never, {}, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqToastComponent, "kbq-toast", never, {}, {}, never, never, true, [{ directive: typeof i1.KbqReadStateDirective; inputs: {}; outputs: {}; }]>;
 }

package/toast/toast.component.scss

@@ -55,6 +55,10 @@
         overflow: hidden;
         text-overflow: ellipsis;
     }
+
+    &.kbq-toast__title_only-text {
+        white-space: pre-wrap;
+    }
 }
 
 .kbq-toast__title_with-content {
@@ -65,13 +69,19 @@
     display: flex;
     flex: 1;
     align-items: center;
+
+    &.kbq-toast__text_only-text {
+        white-space: pre-wrap;
+    }
 }
 
 .kbq-toast__content {
     display: flex;
     flex-direction: column;
 
-    white-space: pre-wrap;
+    &.kbq-toast__content_only-text {
+        white-space: pre-wrap;
+    }
 }
 
 .kbq-toast__actions {

package/toast/toast.service.d.ts

@@ -15,6 +15,7 @@ export declare class KbqToastService<T extends KbqToastComponent = KbqToastCompo
     private toastConfig;
     get toasts(): ComponentRef<T>[];
     get templates(): EmbeddedViewRef<T>[];
+    readonly read: BehaviorSubject<KbqToastData | null>;
     readonly hovered: BehaviorSubject<boolean>;
     readonly focused: BehaviorSubject<boolean>;
     readonly animation: BehaviorSubject<AnimationEvent | null>;

package/toast/toast.type.d.ts

@@ -15,6 +15,7 @@ export declare enum KbqToastPosition {
     CENTER = "center"
 }
 export declare class KbqToastData {
+    id?: string;
     title?: string | TemplateRef<any>;
     style?: KbqToastStyle | string;
     icon?: TemplateRef<any> | boolean;

package/tree/toggle.d.ts

@@ -20,7 +20,7 @@ export declare class KbqTreeNodeToggleBaseDirective<T> {
 }
 export declare class KbqTreeNodeToggleComponent<T> extends KbqTreeNodeToggleBaseDirective<T> {
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTreeNodeToggleComponent<any>, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTreeNodeToggleComponent<any>, "kbq-tree-node-toggle", ["kbqTreeNodeToggle"], {}, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTreeNodeToggleComponent<any>, "kbq-tree-node-toggle", ["kbqTreeNodeToggle"], {}, {}, never, ["*"], false, never>;
 }
 export declare class KbqTreeNodeToggleDirective<T> extends KbqTreeNodeToggleBaseDirective<T> {
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTreeNodeToggleDirective<any>, never>;

package/tree/tree-base.d.ts

@@ -75,7 +75,7 @@ export declare class KbqTreeBase<T> implements AfterContentChecked, CollectionVi
     static ɵdir: i0.ɵɵDirectiveDeclaration<KbqTreeBase<any>, never, never, { "treeControl": { "alias": "treeControl"; "required": false; }; "trackBy": { "alias": "trackBy"; "required": false; }; "dataSource": { "alias": "dataSource"; "required": false; }; }, {}, ["nodeDefs"], never, false, never>;
 }
 export declare class KbqTreeNode<T> implements IFocusableOption, OnDestroy {
-    protected elementRef: ElementRef;
+    protected elementRef: ElementRef<HTMLElement>;
     tree: KbqTreeBase<T>;
     /**
      * The most recently created `KbqTreeNode`. We save it in static variable so we can retrieve it
@@ -88,7 +88,7 @@ export declare class KbqTreeNode<T> implements IFocusableOption, OnDestroy {
     private _data;
     get isExpanded(): boolean;
     get level(): number;
-    constructor(elementRef: ElementRef, tree: KbqTreeBase<T>);
+    constructor(elementRef: ElementRef<HTMLElement>, tree: KbqTreeBase<T>);
     ngOnDestroy(): void;
     focus(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTreeNode<any>, never>;

package/tree/tree-option.component.d.ts

@@ -58,7 +58,7 @@ export declare class KbqTreeOption extends KbqTreeNode<KbqTreeOption> implements
     get toggleElement(): KbqTreeNodeToggleBaseDirective<KbqTreeOption>;
     get isToggleInDefaultPlace(): boolean;
     checkboxState: KbqPseudoCheckboxState;
-    constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef, ngZone: NgZone, tree: any);
+    constructor(elementRef: ElementRef<HTMLElement>, changeDetectorRef: ChangeDetectorRef, ngZone: NgZone, tree: any);
     ngAfterContentInit(): void;
     descendantsAllSelected(): boolean;
     descendantsPartiallySelected(): boolean;

package/tree/tree-selection.component.d.ts

@@ -76,7 +76,7 @@ export declare class KbqTreeSelection extends KbqTreeBase<any> implements Contro
     get isEmpty(): boolean;
     private optionFocusSubscription;
     private optionBlurSubscription;
-    constructor(elementRef: ElementRef, scheduler: AsyncScheduler, differs: IterableDiffers, changeDetectorRef: ChangeDetectorRef, multiple: MultipleMode, clipboard: Clipboard);
+    constructor(elementRef: ElementRef<HTMLElement>, scheduler: AsyncScheduler, differs: IterableDiffers, changeDetectorRef: ChangeDetectorRef, multiple: MultipleMode, clipboard: Clipboard);
     ngAfterContentInit(): void;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;

package/tree-select/tree-select.component.d.ts

@@ -24,6 +24,18 @@ export type KbqTreeSelectOptions = Partial<{
      * If set to null or an empty string, the panel will grow to match the longest option's text.
      */
     panelWidth: KbqTreeSelectPanelWidth;
+    /**
+     * Minimum width of the panel. If minWidth is larger than window width or property set to null, it will be ignored.
+     */
+    panelMinWidth: Exclude<KbqTreeSelectPanelWidth, 'auto'>;
+    /**
+     * Whether to enable hiding search by default if options is less than minimum.
+     *
+     * - `'auto'` uses `KBQ_SELECT_SEARCH_MIN_OPTIONS_THRESHOLD` as min value.
+     * - number - will enables search hiding and uses value as min.
+     * @see KBQ_SELECT_SEARCH_MIN_OPTIONS_THRESHOLD
+     */
+    searchMinOptionsThreshold: 'auto' | number;
 }>;
 /** Injection token that can be used to provide the default options for the `kbq-tree-select`. */
 export declare const KBQ_TREE_SELECT_OPTIONS: InjectionToken<Partial<{
@@ -32,6 +44,18 @@ export declare const KBQ_TREE_SELECT_OPTIONS: InjectionToken<Partial<{
      * If set to null or an empty string, the panel will grow to match the longest option's text.
      */
     panelWidth: KbqTreeSelectPanelWidth;
+    /**
+     * Minimum width of the panel. If minWidth is larger than window width or property set to null, it will be ignored.
+     */
+    panelMinWidth: Exclude<KbqTreeSelectPanelWidth, "auto">;
+    /**
+     * Whether to enable hiding search by default if options is less than minimum.
+     *
+     * - `'auto'` uses `KBQ_SELECT_SEARCH_MIN_OPTIONS_THRESHOLD` as min value.
+     * - number - will enables search hiding and uses value as min.
+     * @see KBQ_SELECT_SEARCH_MIN_OPTIONS_THRESHOLD
+     */
+    searchMinOptionsThreshold: "auto" | number;
 }>>;
 /** Utility provider for `KBQ_TREE_SELECT_OPTIONS`. */
 export declare const kbqTreeSelectOptionsProvider: (options: KbqTreeSelectOptions) => Provider;
@@ -43,7 +67,7 @@ export declare class KbqTreeSelectChange {
     constructor(source: KbqTreeSelect, value: any, isUserInput?: boolean);
 }
 export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterContentInit, AfterViewInit, OnDestroy, OnInit, DoCheck, ControlValueAccessor, KbqFormFieldControl<KbqTreeOption>, CanUpdateErrorState {
-    elementRef: ElementRef;
+    elementRef: ElementRef<HTMLElement>;
     readonly changeDetectorRef: ChangeDetectorRef;
     private readonly ngZone;
     private readonly renderer;
@@ -185,6 +209,11 @@ export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterCon
     protected overlayWidth: string | number;
     /** Min width of the overlay panel. */
     protected overlayMinWidth: string | number;
+    /**
+     * Minimum width of the panel.
+     * If minWidth is larger than window width, it will be ignored.
+     */
+    panelMinWidth: Exclude<KbqTreeSelectPanelWidth, 'auto'>;
     /** Origin for the overlay panel. */
     protected overlayOrigin?: CdkOverlayOrigin | ElementRef;
     /**
@@ -192,6 +221,15 @@ export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterCon
      * If set to null or an empty string, the panel will grow to match the longest option's text.
      */
     panelWidth: KbqTreeSelectPanelWidth;
+    /**
+     * Controls when the search functionality is displayed based on the number of available options.
+     *
+     * Automatically enables search hiding if value provided, even if `defaultOptions.searchMinOptionsThreshold` is provided.
+     * @default undefined
+     */
+    set searchMinOptionsThreshold(value: 'auto' | number | undefined);
+    get searchMinOptionsThreshold(): number | undefined;
+    private _searchMinOptionsThreshold;
     get panelOpen(): boolean;
     get canShowCleaner(): boolean;
     /** @docs-private */
@@ -208,7 +246,7 @@ export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterCon
     private tempValues;
     private readonly destroyRef;
     private readonly window;
-    constructor(elementRef: ElementRef, changeDetectorRef: ChangeDetectorRef, ngZone: NgZone, renderer: Renderer2, defaultErrorStateMatcher: ErrorStateMatcher, scrollStrategyFactory: any, dir: Directionality, parentForm: NgForm, parentFormGroup: FormGroupDirective, parentFormField: KbqFormField, ngControl: NgControl, localeService?: KbqLocaleService | undefined);
+    constructor(elementRef: ElementRef<HTMLElement>, changeDetectorRef: ChangeDetectorRef, ngZone: NgZone, renderer: Renderer2, defaultErrorStateMatcher: ErrorStateMatcher, scrollStrategyFactory: any, dir: Directionality, parentForm: NgForm, parentFormGroup: FormGroupDirective, parentFormField: KbqFormField, ngControl: NgControl, localeService?: KbqLocaleService | undefined);
     ngOnInit(): void;
     ngDoCheck(): void;
     ngAfterContentInit(): void;
@@ -281,6 +319,8 @@ export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterCon
     /** Invoked when an option is clicked. */
     onRemoveSelectedOption(selectedOption: any, $event: any): void;
     calculateHiddenItems(): void;
+    /** @docs-private */
+    protected shouldShowSearch(): boolean;
     private updateLocaleParams;
     private closingActions;
     private getTotalItemsWidthInMatcher;
@@ -309,9 +349,10 @@ export declare class KbqTreeSelect extends KbqAbstractSelect implements AfterCon
     private scrollActiveOptionIntoView;
     private subscribeOnSearchChanges;
     static ɵfac: i0.ɵɵFactoryDeclaration<KbqTreeSelect, [null, null, null, null, null, null, { optional: true; }, { optional: true; }, { optional: true; }, { optional: true; host: true; }, { optional: true; self: true; }, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTreeSelect, "kbq-tree-select", ["kbqTreeSelect"], { "hiddenItemsText": { "alias": "hiddenItemsText"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "backdropClass": { "alias": "backdropClass"; "required": false; }; "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; }; "sortComparator": { "alias": "sortComparator"; "required": false; }; "multiline": { "alias": "multiline"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "autoSelect": { "alias": "autoSelect"; "required": false; }; "id": { "alias": "id"; "required": false; }; "hasBackdrop": { "alias": "hasBackdrop"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "selectAllHandler": { "alias": "selectAllHandler"; "required": false; }; "panelWidth": { "alias": "panelWidth"; "required": false; }; "hiddenItemsTextFormatter": { "alias": "hiddenItemsTextFormatter"; "required": false; }; }, { "openedChange": "openedChange"; "openedStream": "opened"; "closedStream": "closed"; "selectionChange": "selectionChange"; "valueChange": "valueChange"; }, ["cleaner", "customTrigger", "customMatcher", "customTagTemplateRef", "tree", "search"], ["kbq-select-matcher, [kbq-select-matcher]", "kbq-select-trigger, [kbq-select-trigger]", "kbq-cleaner", "[kbqSelectSearch]", "[kbq-select-search-empty-result]", "kbq-tree-selection", "kbq-select-footer,[kbq-tree-select-footer]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqTreeSelect, "kbq-tree-select", ["kbqTreeSelect"], { "hiddenItemsText": { "alias": "hiddenItemsText"; "required": false; }; "panelClass": { "alias": "panelClass"; "required": false; }; "backdropClass": { "alias": "backdropClass"; "required": false; }; "errorStateMatcher": { "alias": "errorStateMatcher"; "required": false; }; "sortComparator": { "alias": "sortComparator"; "required": false; }; "multiline": { "alias": "multiline"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "required": { "alias": "required"; "required": false; }; "multiple": { "alias": "multiple"; "required": false; }; "autoSelect": { "alias": "autoSelect"; "required": false; }; "id": { "alias": "id"; "required": false; }; "hasBackdrop": { "alias": "hasBackdrop"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "selectAllHandler": { "alias": "selectAllHandler"; "required": false; }; "panelMinWidth": { "alias": "panelMinWidth"; "required": false; }; "panelWidth": { "alias": "panelWidth"; "required": false; }; "searchMinOptionsThreshold": { "alias": "searchMinOptionsThreshold"; "required": false; }; "hiddenItemsTextFormatter": { "alias": "hiddenItemsTextFormatter"; "required": false; }; }, { "openedChange": "openedChange"; "openedStream": "opened"; "closedStream": "closed"; "selectionChange": "selectionChange"; "valueChange": "valueChange"; }, ["cleaner", "customTrigger", "customMatcher", "customTagTemplateRef", "tree", "search"], ["kbq-select-matcher, [kbq-select-matcher]", "kbq-select-trigger, [kbq-select-trigger]", "kbq-cleaner", "[kbqSelectSearch]", "[kbq-select-search-empty-result]", "kbq-tree-selection", "kbq-select-footer,[kbq-tree-select-footer]"], false, never>;
     static ngAcceptInputType_multiline: unknown;
     static ngAcceptInputType_multiple: unknown;
     static ngAcceptInputType_tabIndex: unknown;
     static ngAcceptInputType_disabled: unknown;
+    static ngAcceptInputType_panelMinWidth: unknown;
 }