@koobiq/components 18.18.0 → 18.19.0

package/filter-bar/_filter-bar-theme.scss

@@ -0,0 +1,61 @@
+@use '../core/styles/common/tokens' as *;
+
+@mixin kbq-filter-bar-typography() {
+    .kbq-hint.kbq-date-period__hint .kbq-hint__text {
+        @include kbq-typography-level-to-styles-css-variables(typography, text-compact);
+    }
+}
+
+@mixin _icon($left-icon, $right-icon) {
+    .kbq-icon {
+        color: $left-icon;
+
+        &.kbq-icon_left {
+            color: $left-icon;
+        }
+
+        &.kbq-icon_right {
+            color: $right-icon;
+        }
+    }
+}
+
+@mixin kbq-button-changed-filter() {
+    .kbq-button-overlay {
+        display: none;
+    }
+
+    .kbq-button,
+    .kbq-button-icon {
+        -webkit-font-smoothing: antialiased;
+
+        &.kbq-button_changed-filter {
+            color: var(--kbq-foreground-theme);
+            background: var(--kbq-states-background-theme-less-active);
+
+            @include _icon(var(--kbq-icon-theme), var(--kbq-icon-theme));
+
+            &:hover:not(.kbq-disabled),
+            &.kbq-hover:not(.kbq-disabled) {
+                background: var(--kbq-states-background-theme-less-hover);
+            }
+
+            &:active:not(.kbq-disabled),
+            &.kbq-active:not(.kbq-disabled) {
+                background: var(--kbq-states-background-theme-fade-active);
+            }
+
+            &.cdk-keyboard-focused {
+                outline: 1px solid var(--kbq-states-line-focus-theme);
+                border-color: var(--kbq-states-line-focus-theme);
+            }
+
+            &.kbq-disabled {
+                color: var(--kbq-states-foreground-disable);
+                background: var(--kbq-states-background-disable);
+
+                @include _icon(var(--kbq-states-icon-disabled), var(--kbq-states-icon-disabled));
+            }
+        }
+    }
+}

package/filter-bar/filter-bar-button.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+export declare class KbqFilterBarButton {
+    private readonly button;
+    private readonly filterBar;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqFilterBarButton, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqFilterBarButton, "[kbqFilterBarButton]", never, {}, {}, never, never, true, never>;
+}

package/filter-bar/filter-bar.d.ts

@@ -0,0 +1,55 @@
+import { ChangeDetectorRef, EventEmitter } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+import { KbqFilter, KbqPipe, KbqPipeTemplate } from './filter-bar.types';
+import { KbqFilterReset } from './filter-reset';
+import { KbqFilters } from './filters';
+import * as i0 from "@angular/core";
+export declare class KbqFilterBar {
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    protected readonly localeService: import("@koobiq/components/core").KbqLocaleService | null;
+    readonly externalConfiguration: unknown;
+    configuration: any;
+    filters: KbqFilters;
+    filterReset: KbqFilterReset;
+    /** Filter that is currently selected */
+    get filter(): KbqFilter | null;
+    set filter(value: KbqFilter | null);
+    private _filter;
+    /** An array of templates that are used when adding a pipe. Also contains lists of options to select (values). */
+    set pipeTemplates(value: KbqPipeTemplate[]);
+    get pipeTemplates(): KbqPipeTemplate[];
+    private _templates;
+    /**
+     * Event that emits whenever the raw value of the filter changes. This is here primarily
+     * to facilitate the two-way binding for the `filter` input.
+     * @docs-private
+     */
+    readonly filterChange: EventEmitter<KbqFilter | null>;
+    /** Event that emits whenever the value of the pipe changes. */
+    readonly onChangePipe: EventEmitter<KbqPipe>;
+    /** Event that emits whenever the pipe deleted. */
+    readonly onRemovePipe: EventEmitter<KbqPipe>;
+    get isSavedAndChanged(): boolean;
+    get isSaved(): boolean;
+    get isChanged(): boolean;
+    get isReadOnly(): boolean;
+    get isDisabled(): boolean;
+    private savedFilter;
+    readonly changes: BehaviorSubject<void>;
+    readonly internalFilterChanges: BehaviorSubject<KbqFilter | null>;
+    readonly internalTemplatesChanges: BehaviorSubject<KbqPipeTemplate[] | null>;
+    readonly openPipe: BehaviorSubject<string | number | null>;
+    constructor();
+    /** Remove pipe from current filter and emit event */
+    removePipe(pipe: KbqPipe): void;
+    /** Save current state of filter */
+    saveFilterState(filter?: KbqFilter): void;
+    /** Restore previously saved filter state */
+    restoreFilterState(filter?: KbqFilter): void;
+    /** Set the filter state "changed" to false */
+    resetFilterChangedState(): void;
+    private updateLocaleParams;
+    private initDefaultParams;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqFilterBar, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqFilterBar, "kbq-filter-bar, [kbq-filter-bar]", never, { "filter": { "alias": "filter"; "required": false; }; "pipeTemplates": { "alias": "pipeTemplates"; "required": false; }; }, { "filterChange": "filterChange"; "onChangePipe": "onChangePipe"; "onRemovePipe": "onRemovePipe"; }, ["filters", "filterReset"], ["kbq-filters", "*", "kbq-pipe-add", "kbq-filter-reset", "kbq-filter-search, [kbq-filter-search]", "kbq-filter-refresher, [kbq-filter-refresher]"], true, never>;
+}

package/filter-bar/filter-bar.module.d.ts

@@ -0,0 +1,17 @@
+import * as i0 from "@angular/core";
+import * as i1 from "./filter-bar";
+import * as i2 from "./filters";
+import * as i3 from "./filter-refresher";
+import * as i4 from "./filter-bar-button";
+import * as i5 from "./filter-reset";
+import * as i6 from "./pipe-add";
+import * as i7 from "./pipe.directive";
+import * as i8 from "./pipes/pipe-button";
+import * as i9 from "./filter-search";
+import * as i10 from "./pipes/pipe-title";
+import * as i11 from "./pipes/pipe-state";
+export declare class KbqFilterBarModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqFilterBarModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqFilterBarModule, never, [typeof i1.KbqFilterBar, typeof i2.KbqFilters, typeof i3.KbqFilterBarRefresher, typeof i4.KbqFilterBarButton, typeof i5.KbqFilterReset, typeof i6.KbqPipeAdd, typeof i7.KbqPipeDirective, typeof i8.KbqPipeButton, typeof i9.KbqFilterBarSearch, typeof i10.KbqPipeTitleDirective, typeof i11.KbqPipeState], [typeof i1.KbqFilterBar, typeof i2.KbqFilters, typeof i3.KbqFilterBarRefresher, typeof i4.KbqFilterBarButton, typeof i5.KbqFilterReset, typeof i6.KbqPipeAdd, typeof i7.KbqPipeDirective, typeof i8.KbqPipeButton, typeof i9.KbqFilterBarSearch, typeof i10.KbqPipeTitleDirective, typeof i11.KbqPipeState]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<KbqFilterBarModule>;
+}

package/filter-bar/filter-bar.scss

@@ -0,0 +1,60 @@
+@use './filter-bar-theme' as *;
+
+.kbq-filter-bar {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+
+    width: 100%;
+
+    .kbq-filter-bar__left {
+        display: flex;
+        flex-direction: row;
+        flex-wrap: wrap;
+
+        gap: var(--kbq-size-s);
+
+        .kbq-button > .kbq-icon {
+            margin-right: var(--kbq-size-xxs);
+        }
+
+        & > .kbq-icon {
+            align-self: center;
+        }
+    }
+
+    .kbq-filter-bar__right {
+        display: flex;
+        flex-direction: row;
+
+        margin-left: var(--kbq-size-3xl);
+    }
+}
+
+.kbq-pipe__popover {
+    .kbq-popover__container {
+        min-width: 320px;
+    }
+
+    .kbq-popover__content {
+        padding: var(--kbq-size-m) var(--kbq-size-m) 1px !important;
+    }
+
+    .kbq-popover__footer {
+        padding: var(--kbq-size-xxs);
+
+        & .kbq-button:not(.kbq-disabled) {
+            display: flex;
+            flex-direction: row;
+            width: 100%;
+            justify-content: flex-start;
+
+            & .kbq-button_hot-key {
+                color: var(--kbq-foreground-contrast-secondary);
+            }
+        }
+    }
+}
+
+@include kbq-button-changed-filter();
+@include kbq-filter-bar-typography();

package/filter-bar/filter-bar.types.d.ts

@@ -0,0 +1,97 @@
+import { InjectionToken, TemplateRef } from '@angular/core';
+import { KbqFilterBar } from './filter-bar';
+export declare const KBQ_FILTER_BAR_CONFIGURATION: InjectionToken<unknown>;
+export declare const KBQ_FILTER_BAR_DEFAULT_CONFIGURATION: {
+    reset: {
+        buttonName: string;
+    };
+    search: {
+        tooltip: string;
+        placeholder: string;
+    };
+    filters: {
+        defaultName: string;
+        saveNewFilterTooltip: string;
+        searchPlaceholder: string;
+        searchEmptyResult: string;
+        saveAsNewFilter: string;
+        saveChanges: string;
+        saveAsNew: string;
+        change: string;
+        resetChanges: string;
+        remove: string;
+        name: string;
+        error: string;
+        errorHint: string;
+        saveButton: string;
+        cancelButton: string;
+    };
+    add: {
+        tooltip: string;
+    };
+    pipe: {
+        clearButtonTooltip: string;
+        removeButtonTooltip: string;
+        applyButton: string;
+        emptySearchResult: string;
+    };
+    datePipe: {
+        customPeriod: string;
+        customPeriodFrom: string;
+        customPeriodTo: string;
+        customPeriodErrorHint: string;
+        backToPeriodSelection: string;
+    };
+};
+export declare enum KbqPipeTypes {
+    Text = "text",
+    Select = "select",
+    MultiSelect = "multiselect",
+    Date = "date",
+    Datetime = "datetime"
+}
+export interface KbqDateTimeValue {
+    name?: string;
+    start?: string;
+    end?: string;
+}
+export interface KbqSelectValue {
+    name: string;
+    value: unknown;
+}
+export interface KbqFilter {
+    name: string;
+    pipes: KbqPipe[];
+    readonly: boolean;
+    disabled: boolean;
+    changed: boolean;
+    saved: boolean;
+}
+export interface KbqPipe {
+    name: string;
+    id?: string | number;
+    type: KbqPipeTypes;
+    value: unknown | null;
+    search?: boolean;
+    required: boolean;
+    cleanable: boolean;
+    removable: boolean;
+    disabled: boolean;
+}
+export interface KbqPipeData<V> extends KbqPipe {
+    value: V | null;
+    search?: boolean;
+    openOnAdd?: boolean;
+}
+export interface KbqPipeTemplate extends Omit<KbqPipe, 'value'> {
+    values?: unknown[];
+    valueTemplate?: TemplateRef<any> | string;
+}
+export interface KbqSaveFilterError {
+    text?: string;
+    nameAlreadyExists?: boolean;
+}
+export interface KbqSaveFilterEvent {
+    filter: KbqFilter | null;
+    filterBar: KbqFilterBar;
+}

package/filter-bar/filter-refresher.d.ts

@@ -0,0 +1,5 @@
+import * as i0 from "@angular/core";
+export declare class KbqFilterBarRefresher {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqFilterBarRefresher, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqFilterBarRefresher, "kbq-filter-refresher, [kbq-filter-refresher]", never, {}, {}, never, never, true, never>;
+}

package/filter-bar/filter-refresher.scss

@@ -0,0 +1,6 @@
+.kbq-filter-refresher {
+    display: flex;
+    align-items: center;
+
+    min-width: 64px;
+}

package/filter-bar/filter-reset.d.ts

@@ -0,0 +1,11 @@
+import { EventEmitter } from '@angular/core';
+import { KbqFilterBar } from './filter-bar';
+import { KbqFilter } from './filter-bar.types';
+import * as i0 from "@angular/core";
+export declare class KbqFilterReset {
+    protected readonly filterBar: KbqFilterBar;
+    /** Event that is generated whenever the user reset a filter. */
+    readonly onResetFilter: EventEmitter<KbqFilter | null>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqFilterReset, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqFilterReset, "kbq-filter-reset", never, {}, { "onResetFilter": "onResetFilter"; }, never, ["*"], true, never>;
+}

package/filter-bar/filter-search.d.ts

@@ -0,0 +1,25 @@
+import { ChangeDetectorRef, EventEmitter } from '@angular/core';
+import { UntypedFormControl } from '@angular/forms';
+import { KbqButton } from '@koobiq/components/button';
+import { KbqInput } from '@koobiq/components/input';
+import { KbqTooltipTrigger } from '@koobiq/components/tooltip';
+import { KbqFilterBar } from './filter-bar';
+import * as i0 from "@angular/core";
+export declare class KbqFilterBarSearch {
+    protected readonly filterBar: KbqFilterBar;
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    input: KbqInput;
+    button: KbqButton;
+    tooltip: KbqTooltipTrigger;
+    searchControl: UntypedFormControl;
+    isSearchActive: boolean;
+    readonly onSearch: EventEmitter<string>;
+    constructor();
+    openSearch(): void;
+    onBlur(): void;
+    onEscape(): void;
+    onClear(): void;
+    onReset: () => void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqFilterBarSearch, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqFilterBarSearch, "kbq-filter-search, [kbq-filter-search]", never, {}, { "onSearch": "onSearch"; }, never, never, true, never>;
+}

package/filter-bar/filter-search.scss

@@ -0,0 +1,14 @@
+.kbq-filter-search {
+    display: flex;
+    align-items: start;
+
+    max-width: 260px;
+
+    & .kbq-input {
+        width: 260px;
+    }
+
+    .kbq-filter_hidden {
+        display: none;
+    }
+}

package/filter-bar/filters.d.ts

@@ -0,0 +1,72 @@
+import { ChangeDetectorRef, ElementRef, EventEmitter, OnInit } from '@angular/core';
+import { FormControl, UntypedFormControl } from '@angular/forms';
+import { KbqButton, KbqButtonStyles } from '@koobiq/components/button';
+import { KbqComponentColors, PopUpPlacements, PopUpSizes } from '@koobiq/components/core';
+import { KbqDropdownTrigger } from '@koobiq/components/dropdown';
+import { KbqPopoverTrigger } from '@koobiq/components/popover';
+import { Observable } from 'rxjs';
+import { KbqFilterBar } from './filter-bar';
+import { KbqFilter, KbqSaveFilterError, KbqSaveFilterEvent } from './filter-bar.types';
+import * as i0 from "@angular/core";
+export declare class KbqFilters implements OnInit {
+    protected readonly placements: typeof PopUpPlacements;
+    protected readonly filterBar: KbqFilterBar;
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    button: KbqButton;
+    popover: KbqPopoverTrigger;
+    dropdown: KbqDropdownTrigger;
+    search: ElementRef;
+    newFilterName: ElementRef;
+    protected readonly styles: typeof KbqButtonStyles;
+    protected readonly colors: typeof KbqComponentColors;
+    searchControl: UntypedFormControl;
+    filteredOptions: Observable<KbqFilter[]>;
+    popoverSize: PopUpSizes;
+    filterName: FormControl<string | null>;
+    saveNewFilter: boolean;
+    showFilterSavingError: boolean;
+    filterSavingErrorText: string;
+    filters: KbqFilter[];
+    /** Event that is generated whenever the user selects a filter. */
+    readonly onSelectFilter: EventEmitter<KbqFilter>;
+    /** Event that is generated whenever the user save a filter. */
+    readonly onSave: EventEmitter<KbqSaveFilterEvent>;
+    /** Event that is generated whenever the user change a filter. */
+    readonly onChangeFilter: EventEmitter<KbqSaveFilterEvent>;
+    /** Event that is generated whenever the user saves a filter as new. */
+    readonly onSaveAsNew: EventEmitter<KbqSaveFilterEvent>;
+    /** Event that is generated whenever the user remove a filter. */
+    readonly onRemoveFilter: EventEmitter<KbqFilter>;
+    /** Event that is generated whenever the user reset a filter changes. */
+    readonly onResetFilterChanges: EventEmitter<KbqFilter | null>;
+    get popoverHeader(): string;
+    /** Component state. true if opened dropdown or popup */
+    get opened(): boolean;
+    /** Selected filter */
+    get filter(): KbqFilter | null;
+    /** Component state. True if 'filters' input contains no elements. */
+    get isEmpty(): boolean;
+    constructor();
+    ngOnInit(): void;
+    selectFilter(filter: KbqFilter): void;
+    saveChanges(): void;
+    saveAsNew(): void;
+    showError(error?: KbqSaveFilterError): void;
+    restoreFocus(): void;
+    preparePopover(): void;
+    openSaveAsNewFilterPopover(): void;
+    openChangeFilterNamePopover(): void;
+    closePopover: () => void;
+    stopEventPropagation(event: Event): void;
+    searchKeydownHandler(event: KeyboardEvent): void;
+    onDropdownOpen(): void;
+    resetFilterChanges(): void;
+    /** Hide the popup and restore focus.
+     * Use this method in the onSave, onSaveAsNew, or onChangeFilter events after the data has been successfully saved. */
+    filterSavedSuccessfully(): void;
+    /** Shows an error. Use this method in the onSave, onSaveAsNew, or onChangeFilter events if saving data failed. */
+    filterSavedUnsuccessfully(error?: KbqSaveFilterError): void;
+    private getFilteredOptions;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqFilters, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqFilters, "kbq-filters", ["kbqFilters"], { "filters": { "alias": "filters"; "required": false; }; }, { "onSelectFilter": "onSelectFilter"; "onSave": "onSave"; "onChangeFilter": "onChangeFilter"; "onSaveAsNew": "onSaveAsNew"; "onRemoveFilter": "onRemoveFilter"; "onResetFilterChanges": "onResetFilterChanges"; }, never, ["*"], true, never>;
+}

package/filter-bar/filters.scss

@@ -0,0 +1,92 @@
+@use '../core/styles/common';
+@use './filter-bar-theme' as *;
+
+.kbq-filters {
+    display: flex;
+
+    > .kbq-button {
+        max-width: 320px;
+
+        & .kbq-button-wrapper {
+            width: 100%;
+        }
+    }
+
+    > .kbq-button .kbq-icon {
+        margin-right: var(--kbq-size-xxs);
+    }
+
+    & .kbq-filters__filter-name {
+        @include common.kbq-truncate-line();
+    }
+
+    & .kbq-filter-bar__separator {
+        align-self: center;
+
+        height: var(--kbq-size-m) !important;
+
+        margin-left: calc(var(--kbq-size-s) + var(--kbq-size-xs)) !important;
+        margin-right: var(--kbq-size-xs) !important;
+    }
+
+    & .kbq-filter-bar__arrow {
+        align-self: center;
+
+        margin-left: var(--kbq-size-s);
+    }
+
+    .kbq-button.kbq-button_changed-filter {
+        border-bottom-right-radius: unset;
+        border-top-right-radius: unset;
+    }
+
+    .kbq-button-icon {
+        margin-left: -1px;
+
+        border-bottom-left-radius: unset;
+        border-top-left-radius: unset;
+    }
+
+    .kbq-button_changed-saved-filter {
+        &::before {
+            content: '';
+            position: absolute;
+            right: -4px;
+            top: -4px;
+
+            width: var(--kbq-size-s);
+            height: var(--kbq-size-s);
+
+            border: 2px solid var(--kbq-background-bg);
+            border-radius: var(--kbq-size-xs);
+
+            background: var(--kbq-icon-warning);
+        }
+    }
+
+    .kbq-button:not(:hover, .kbq-active) + .kbq-button_action:not(:hover, .kbq-active)::after {
+        content: '';
+        position: absolute;
+        left: 0;
+        top: 10px;
+
+        width: 1px;
+        height: var(--kbq-size-m);
+
+        background: var(--kbq-line-contrast-less);
+    }
+}
+
+.kbq-filters__save-as-new-filter-popover {
+    & .kbq-popover__container {
+        width: 400px;
+    }
+
+    & .kbq-popover__content {
+        padding: var(--kbq-size-s) var(--kbq-size-xxl);
+    }
+}
+
+.kbq-filters__dropdown .kbq-dropdown-item {
+    padding-right: var(--kbq-size-s);
+}

package/filter-bar/index.d.ts

@@ -0,0 +1 @@
+export * from './public-api';

package/filter-bar/pipe-add.d.ts

@@ -0,0 +1,18 @@
+import { EventEmitter } from '@angular/core';
+import { KbqOption } from '@koobiq/components/core';
+import { KbqSelect } from '@koobiq/components/select';
+import { KbqFilterBar } from './filter-bar';
+import { KbqFilter, KbqPipe, KbqPipeTemplate } from './filter-bar.types';
+import * as i0 from "@angular/core";
+export declare class KbqPipeAdd {
+    protected readonly filterBar: KbqFilterBar;
+    select: KbqSelect;
+    readonly onAddPipe: EventEmitter<KbqPipeTemplate>;
+    filterTemplate: KbqFilter;
+    addedPipes: (string | number)[];
+    constructor();
+    addPipeFromTemplate(option: KbqOption): void;
+    compareWith(o1: KbqPipe, o2: string): boolean;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqPipeAdd, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqPipeAdd, "kbq-pipe-add", never, { "filterTemplate": { "alias": "filterTemplate"; "required": false; }; }, { "onAddPipe": "onAddPipe"; }, never, never, true, never>;
+}

package/filter-bar/pipe-add.scss

@@ -0,0 +1,5 @@
+.kbq-pipe-add {
+    & .kbq-select .kbq-select__trigger {
+        height: unset;
+    }
+}

package/filter-bar/pipe.directive.d.ts

@@ -0,0 +1,13 @@
+import { AfterContentInit, Injector, ViewContainerRef } from '@angular/core';
+import { KbqPipe, KbqPipeTemplate } from './filter-bar.types';
+import * as i0 from "@angular/core";
+export declare class KbqPipeDirective<T extends KbqPipe> implements AfterContentInit {
+    private injector;
+    protected readonly viewContainerRef: ViewContainerRef;
+    values: KbqPipeTemplate[];
+    pipe: T;
+    ngAfterContentInit(): void;
+    getInjector(pipe: T): Injector;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqPipeDirective<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqPipeDirective<any>, "[kbqPipe]", never, { "pipe": { "alias": "kbqPipe"; "required": false; }; }, {}, never, never, true, never>;
+}

package/filter-bar/pipes/base-pipe.d.ts

@@ -0,0 +1,40 @@
+import { AfterViewInit, ChangeDetectorRef, ElementRef, InjectionToken, TemplateRef } from '@angular/core';
+import { Subject } from 'rxjs';
+import { KbqFilterBar } from '../filter-bar';
+import { KbqPipeData, KbqPipeTemplate } from '../filter-bar.types';
+import * as i0 from "@angular/core";
+export declare const KBQ_PIPE_DATA: InjectionToken<unknown>;
+export declare abstract class KbqBasePipe<V> implements AfterViewInit {
+    readonly stateChanges: Subject<void>;
+    readonly data: KbqPipeData<V>;
+    protected readonly filterBar: KbqFilterBar | null;
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    protected values: any;
+    protected valueTemplate?: TemplateRef<any> | string;
+    isMac: boolean;
+    $implicit: unknown;
+    get isEmpty(): boolean;
+    get showRemoveButton(): boolean;
+    get localeData(): any;
+    constructor();
+    ngAfterViewInit(): void;
+    isTemplateRef(value: any): boolean;
+    updateTemplates: (templates: KbqPipeTemplate[] | null) => void;
+    onRemove(): void;
+    onClear(): void;
+    abstract open(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqBasePipe<any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqBasePipe<any>, never, never, {}, {}, never, never, true, never>;
+}
+export declare class KbqPipeMinWidth {
+    protected readonly filterBar: KbqFilterBar | null;
+    protected readonly elementRef: ElementRef<any>;
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    minWidth: string;
+    maxSymbolsForFitContent: number;
+    get textLength(): number;
+    constructor();
+    update: () => void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqPipeMinWidth, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqPipeMinWidth, "[kbqPipeMinWidth]", never, {}, {}, never, never, true, never>;
+}